JS组件系列——Bootstrap 树控件使用经验分享 - 懒得安分 - 博客园

节点全部收起

节点展开

节点选中，当然如果需要可以变成单选。

可以增删改节点

点击文本框出现树

3、代码示例

3.1 直接在界面显示文本框

需要引用的js和css文件

页面html

Js初始化

var setting = {

view: {

addHoverDom: addHoverDom,

removeHoverDom: removeHoverDom,

selectedMulti: false

},

check: {

enable: true

},

data: {

simpleData: {

enable: true

}

},

edit: {

enable: false

}

};

var zNodes = [

{ id: 1, pId: 0, name: “父节点1”, open: true },

{ id: 11, pId: 1, name: “父节点11” },

{ id: 111, pId: 11, name: “叶子节点111” },

{ id: 112, pId: 11, name: “叶子节点112” },

{ id: 113, pId: 11, name: “叶子节点113” },

{ id: 114, pId: 11, name: “叶子节点114” },

{ id: 12, pId: 1, name: “父节点12” },

{ id: 121, pId: 12, name: “叶子节点121” },

{ id: 122, pId: 12, name: “叶子节点122” },

{ id: 123, pId: 12, name: “叶子节点123” },

{ id: 124, pId: 12, name: “叶子节点124” },

{ id: 13, pId: 1, name: “父节点13”, isParent: true },

{ id: 2, pId: 0, name: “父节点2” },

{ id: 21, pId: 2, name: “父节点21”, open: true },

{ id: 211, pId: 21, name: “叶子节点211” },

{ id: 212, pId: 21, name: “叶子节点212” },

{ id: 213, pId: 21, name: “叶子节点213” },

{ id: 214, pId: 21, name: “叶子节点214” },

{ id: 22, pId: 2, name: “父节点22” },</