關於jstree的使用

2021-10-01 23:21:04 字數 2287 閱讀 7078

1.動態展示圖示

先給乙個展示樹形結構的div

'workunittree'

>

<

/div>

$('#workunittree').

jstree(,

async :

false

, url :

'/getworkunittreedata'

, success :

function

(data)

//"state":

} jsonarray.

push

(arr);}

}});

callback.

call

(this

, jsonarray);}

,'themes':,

'dblclick_toggle'

:true

,//雙擊展開

"multiple"

:false

,//單選

"check_callback"

:true},

'plugins':[

"search"

,"themes"

,"types"

,"state"

,"line"

,'contextmenu'],

//外掛程式

'types':,

'1':

,'2':,

'3':}}

)

結果如圖

data中的資料,在後台建立乙個實體類去接收

public

class 實體類名稱

public list

getroutetreedata

(string userid)

list

buildinglist = routedao.

getbuildingtree

(buildinggrouplist)

;for

(inspectionroutestreedatabean beans : buildinglist)

list

routelist = routedao.

getroutetree

(buildinglist)

;for

(inspectionroutestreedatabean beans : routelist)

}return tree;

}

2.只顯示乙個圖示的
<

!-- 帶搜尋框的 --

>

"jstree"

>

<

/div>

$.ajax(,

async :

false

, url :

'/getroutetreedata'

, success :

function

(data)})

;

$(

'#jstree').

jstree(,

'dblclick_toggle'

:true

,"multiple"

:false

,"check_callback"

:true},

'plugins':[

"search"

,"themes"

,"types"

,"state"

,"line"

,'contextmenu'],

'types':}

,})//搜尋框的功能

/* * var to = false; $('#plugins4_q').keyup(function () to = settimeout(function () , 250); });

*/

結果

$(

'#jstree').

on("select_node.jstree"

,function

(e, data)

記錄第一次使用jstree

jstree使用 一 初次使用

rel stylesheet href 2.jquery.min.js src script 3.jstree.min.js src script 第二步在需要載入jstree的html位置處加入 id jstree vehicle div 第三步寫jstree的呼叫方法 function tree...

jsTree 使用筆記

ajax 初始化 jstree var element tree element.jstree check callback true,data folder file state plugins checkbox dnd state types jstree 獲取節點方法 未採用checkbox ...

jstree使用小結 一

專案中用到tree結構,使用了jstree做個筆記如下 1.官網 有時候打不開,那就只能等打得開的時候再看了.o o ps 一些灰常基本的我可能就略過了.2.先看看效果 2 新增jstree的容器 div id tree1 div 3 初始化jstree 全部 如下 1 doctype html 2...