2、点击完了file的选项的菜单之后,就会d出了下拉菜单中进行选择为“setting”的选项菜单。
3、在d出了settings的设置的选项之后,在设置的列表中进行选择为“system settings”的选项。
4、然后就会展开了system settings选项,进行选择展开的passwords的选项。
5、进入到了passwords的选项之后,进行选中master password的选项。
6、然后就会d出了setup master password的选项,进行输入需要进行确认的密码和确认密码。
获取 zTree 当前被选中的节点数据集合var treeObj = $.fn.zTree.getZTreeObj("tree")
var nodes = treeObj.getSelectedNodes()
获取 zTree 的全部节点数据
var treeObj = $.fn.zTree.getZTreeObj("tree")
var nodes = treeObj.getNodes()
for(var node in nodes){
//判断节点是否选中
var checked = node.checked
if(checked){
alert("该节点处于选中状态")
}else{
alert("该节点未选中")
}
}
在ztree中使用单选->复选层次结构起因
要使用zTree实现该功能:选中状态在各个条件(Linux_ipfwd,Linux_ipsec,usdpaa_hello-reflector,usdpaa_rc_ipfwd)之间互斥,当状态切换时自动取消上个属性下的所有子选项。
解决
因为zTree中单选,复选状态都是使用图片表示的,然后提供接口根据half,checked等属性来返回节点的状态。虽然这样可以灵活的的对节点进行 *** 作,但去失去了最简单的提交方式(submit form)。
所以我们首先将zTree的图片按钮还原成html按钮,这个在zTree中已经提供了demo,我们只要根据demo中的方式来添加自定义控件,代码如下:var _handles = {
0:function (treeNode) {
return ""
},
1:function (treeNode) {
return ""
},
2:function (treeNode) {
return ""
}
}
var IDMark_A = "_a"
function addDiyDom(treeId, treeNode) {
var aObj = $("#" + treeNode.tId + IDMark_A)
aObj.before(_handles[treeNode.level](treeNode))
var btn = $("#fsl_" + treeNode.tId)
if (btn) {
if (treeNode.level == 1) {
btn.bind("click", function () {
click_v1(treeNode)
})
} else if (treeNode.level == 2) {
btn.bind("change", function () {
change_v2(treeNode, btn)
})
}
}
}
这里比较重要的是click_v1,change_v2这两个绑定函数,click_v1绑定到单选按钮的click事件,change_v2绑定到复选框的change事件。代码及相关注释如下://改变节点状态(选中/取消选中)
function changeNode(node, status) {
var btn = $("#fsl_" + node.tId)
if (btn.attr("checked") != status) {
$("#fsl_" + node.tId).attr("checked", Boolean(status))
}
}
//判断节点是否选中
function isSelectNode(node) {
return $("#fsl_" + node.tId).attr("checked")
}
//判断节点的子节点是否全部选中
function isSelectAllChildNoes(node) {
var isSelectAll = true
var childNodes = node.children
if (childNodes) {
for (var i = 0i <childNodes.lengthi++) {
if (!isSelectNode(childNodes[i])) {
isSelectAll = false
break
}
}
}
return isSelectAll
}
//改变节点的所有子节点状态(选中/取消选中)
function changeAllChildNoes(node, status) {
var childNodes = node.children
if (childNodes) {
for (var i = 0i <childNodes.lengthi++) {
changeNode(childNodes[i], status)
changeAllChildNoes(childNodes[i], status)
}
}
}
//改变节点的所有父节点状态(选中/取消选中)
function changeAllParentNoes(node, status) {
var parentNode = node.getParentNode()
if (parentNode) {
if (status) {
if (isSelectAllChildNoes(parentNode)) {
changeNode(parentNode, status)
}
} else {
changeNode(parentNode, status)
}
changeAllParentNoes(parentNode, status)
}
}
//选中的单选框tId
var global_mark = {}
//复选框改变状态所触发的事件
function change_v2(treeNode, btn) {
if (btn.attr("checked")) {
var parentNode = treeNode.getParentNode()
if (!isSelectNode(parentNode)) {
changeNode(parentNode, true)
click_v1(parentNode)
}
}
}
//单选框改变状态所触发的事件
function click_v1(treeNode) {
if (treeNode.tId != global_mark[treeNode.type]) {
var lastNode = treeObj.getNodeByTId(global_mark[treeNode.type])
if (lastNode) {
changeAllChildNoes(lastNode, false)
}
global_mark[treeNode.type] = treeNode.tId
}
}
这样就实现了先前所提到的功能。
文章作者:iitshare
本文地址:http://www.iitshare.com/ztree-radio-checkbox.html
版权所有 © 转载时必须以链接形式注明作者和原始出处!
结语:
,change_v2绑定到复选框的change事件。代码及相关注释如下://改变节点状态(选中/取消选中)
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)