JS元件系列 zTree樹形元件

2021-10-16 22:55:04 字數 988 閱讀 2085

ztree 是乙個依靠 jquery 實現的多功能 「樹外掛程式」, 而且擁有較好的瀏覽器相容性,有著豐富的功能以及可以自定義樣式,足以滿足大部分業務的開發

第一步先導入css及js檔案

第二步在html頁面建立ztree div

第三步初始化ztree

var setting = ,//字型樣式函式

selectedmulti: true //設定是否允許同時選中多個節點

},check:,

chkboxtype: ,

chkstyle: "checkbox",//核取方塊型別

enable: true //每個節點上是否顯示 checkbox

},edit:,

data:

},callback:

};ztreeobj = $.fn.ztree.init($("#regionztree"), setting, dominztree);

下面是ztree操作的效果圖

下面是ztree增刪改以及選中的**

/**

* 新增節點

* @param obj

*/function addztreenode(obj)

/** * 修改子節點

* @param obj

*/function editztreenode(obj) {

var ztree = $.fn.ztree.getztreeobj("regionztree");

var nodes = ztree.getselectednodes();

for(var i = 0;i

zTree樹形元件非同步載入資料

最近公司專案中要用到樹形元件,開始用的layui,後來發現layui的樹形元件不支援非同步載入,在網上查發現實現起來很複雜。而公司專案中也有ztree的css,js,於是就選擇了ztree。先來個普通的,總結分4步 引入js,css就不說了 1,在body裡給個實體 2,配置 setting set...

JS元件開發

看了一篇關於寫js元件開發的部落格,居然看不懂,雖然我前幾天覺得自己把原型那塊弄的非常懂,但是看到上面實際應用的 時,還是一臉懵逼,不知道如何下面的呼叫這個元件的方式為何是這樣,我就寫了下面的乙個小例子 而且呢,你一定要搞清楚this的指向問題,在這裡this都是指向建構函式textcountfun...

js元件開發

首先附上jquery元件開發的 jquery元件開發保證chainability,通過返回this.each jquery.fn.test2 function this.css this.each 裡面的this為jquery物件,但是alert裡面this為dom物件.為什麼要return thi...