EasyUI 是一个 HTML5 框架，用于使用基于 jQuery、React、Angular 和 Vue 技术的用户界面组件。它有助于为交互式 Web 和移动应用程序构建功能，为开发人员节省大量时间。
组合树是一个 UI 组件，它是下拉树与选择控件的组合。
EasyUI for jQuery 下载：
https://www.jeasyui.com/download/index.php注意：在执行以下代码时，请注意预编译文件的正确文件路径。
示例 1：以下示例使用文件“dataTree.json”和 jQuery EasyUI 库演示了基本的组合树。
html
jQuery EasyUI ComboTree
Click the button to show
the data tree.
Javascript
[{
"id":1,
"text":"Users",
"children":[{
"id":11,
"text":"Photos",
"state":"closed",
"children":[{
"id":101,
"text":"Family"
},{
"id":102,
"text":"Colleagues"
},{
"id":103,
"text":"Relatives"
}]
},{
"id":12,
"text":"Program Files",
"children":[{
"id":131,
"text":"Intel"
},{
"id":132,
"text":"nodejs",
"attributes":{
"p1":"my Attribute1",
"p2":"my Attribute2"
}
},{
"id":133,
"text":"Common files"
},{
"id":134,
"text":"Mail",
"checked":true
}]
},{
"id":13,
"text":"home.html"
},{
"id":14,
"text":"tutorials.html"
},{
"id":15,
"text":"jobs.html"
}]
}]html
dataTree.json：以下是所有数据示例中使用的文件“dataTree.json”的代码。
Javascript
[{
"id":1,
"text":"Users",
"children":[{
"id":11,
"text":"Photos",
"state":"closed",
"children":[{
"id":101,
"text":"Family"
},{
"id":102,
"text":"Colleagues"
},{
"id":103,
"text":"Relatives"
}]
},{
"id":12,
"text":"Program Files",
"children":[{
"id":131,
"text":"Intel"
},{
"id":132,
"text":"nodejs",
"attributes":{
"p1":"my Attribute1",
"p2":"my Attribute2"
}
},{
"id":133,
"text":"Common files"
},{
"id":134,
"text":"Mail",
"checked":true
}]
},{
"id":13,
"text":"home.html"
},{
"id":14,
"text":"tutorials.html"
},{
"id":15,
"text":"jobs.html"
}]
}]
输出：
- 带有初始化值的组合树：
- 基本组合树：
示例 2：以下代码演示了在组合树上执行的基本方法。
输出：
- 执行前：
- 执行后：
