具体代码如下所示:
& lt; div id=" searchTree "祝辞& lt;/div>
& lt; script>
var treeData=https://www.yisu.com/zixun/[{
文本:“父1”,
节点:[{
文本:“孩子1”,
节点:[{
文字:“孙子1”
}， {
文本:“孙子2”,
节点:[{
文字:“孙子2 - 1”,
节点:[{
文本:“孙子2-1-1”
}， {
文本:“孙子2-2-1”,
})
}， {
文字:“孙子1 - 2”,
})
})
}， {
文本:“孩子2”,
节点:[{
文本:“孙子2 - 1”
}， {
文字:“孙子2 - 2”,
})
})
}， {
文本:“父2”,
id:“11111”
}， {
文字:“父母3”
}， {
文本:“父4”
}， {
文本:“父5”
});
var nodeCheckedSilent=false;
函数nodeChecked(事件、节点){
如果(nodeCheckedSilent) {
返回;
}
nodeCheckedSilent=true;
checkAllParent(节点);
checkAllSon(节点);
nodeCheckedSilent=false;
}
var nodeUncheckedSilent=false;
函数nodeUnchecked(事件、节点){
如果(nodeUncheckedSilent)
返回;
nodeUncheckedSilent=true;
uncheckAllParent(节点);
uncheckAllSon(节点);
nodeUncheckedSilent=false;
}//选中全部父节点
函数checkAllParent(节点){
$ (" # searchTree”)。treeview (“checkNode”节点。nodeId, {
沉默:真
}）;
var parentNode=$ (“# searchTree”)。treeview (getParent, node.nodeId);
如果(!(“nodeId”parentNode)) {
返回;
其他}{
checkAllParent (parentNode);
}
}//取消全部父节点
函数uncheckAllParent(节点){
$ (" # searchTree”)。treeview (“uncheckNode”节点。nodeId, {
沉默:真
}）;
兄弟姐妹var=$ (“# searchTree”)。treeview (getSiblings, node.nodeId);
var parentNode=$ (“# searchTree”)。treeview (getParent, node.nodeId);
如果(!(“nodeId”parentNode)) {
返回;
}
var isAllUnchecked=true;//是否全部没选中
我在兄弟姐妹(var) {
如果兄弟姐妹[我].state.checked) {
isAllUnchecked=false;
打破;
}
}
如果(isAllUnchecked) {
uncheckAllParent (parentNode);
}
}//级联选中所有子节点
函数checkAllSon(节点){
$ (" # searchTree”)。treeview (“checkNode”节点。nodeId, {
沉默:真
}）;
如果节点。节点!=零,,node.nodes。长度比;0){
我在node.nodes (var) {
checkAllSon (node.nodes[我]);
}
}
}//级联取消所有子节点
函数uncheckAllSon(节点){
$ (" # searchTree”)。treeview (“uncheckNode”节点。nodeId, {
沉默:真
}）;
如果节点。节点!=零,,node.nodes。长度比;0){
我在node.nodes (var) {
uncheckAllSon (node.nodes[我]);
}
}
}
$ (' # searchTree ') .treeview ({
showCheckbox:没错,
数据:treeData,
onNodeChecked: nodeChecked,
onNodeUnchecked: nodeUnchecked
}）;
& lt;/script>
以上所述是小编给大家介绍的引导treeview树形菜单带复选框及级联选择功能,希望对大家有所帮助,如果大家有任何疑问请给我留的言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
