ztree中如何获得选中的checkbox的值

ztree中获得选中的checkbox的值的方法和 *** 作步骤如下：

1、首先，创建一个HTML。 HTML是网页的基础和框架，如下图所示。

2、其次，完成上述步骤后，在html中添加测试数据以测试是否已选中该复选框，如下图所示。

3、接着，完成上述步骤后，编写javascript， 单击该按钮时，将触发事件以获取选定的复选框值，如下图所示。

4、然后，完成上述步骤后，美化页面，添加样式文件，并引入jquery文件，如下图所示。

5、最后，完成上述步骤后，打开浏览器，打开测试页面，然后进行测试，如下图所示。这样，问题就解决了。

将zTree放在一个iframe里

zTreeObj = $("#treeDemo")zTree(setting, zNodes);

如果在当前页面的话，通过var nodes = zTreeObjgetCheckedNodes(); 即可

那么点击父页面的按钮，如何得到zTree已选中的节点？

假设iframe的id和name为aa(id和name都设置，兼容性问题)

windowframes['aa']windowzTreeObjgetCheckedNodes();

在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 = $("#" + treeNodetId + IDMark_A);

aObjbefore(_handles[treeNodelevel](treeNode));

var btn = $("#fsl_" + treeNodetId);

if (btn) {

if (treeNodelevel == 1) {

btnbind("click", function () {

click_v1(treeNode);

});

} else if (treeNodelevel == 2) {

btnbind("change", function () {

change_v2(treeNode, btn);

});

}

}

}

这里比较重要的是click_v1，change_v2这两个绑定函数，click_v1绑定到单选按钮的click事件，change_v2绑定到复选框的change事件。代码及相关注释如下：//改变节点状态（选中／取消选中）

function changeNode(node, status) {

var btn = $("#fsl_" + nodetId);

if (btnattr("checked") != status) {

$("#fsl_" + nodetId)attr("checked", Boolean(status));

}

}

//判断节点是否选中

function isSelectNode(node) {

return $("#fsl_" + nodetId)attr("checked");

}

//判断节点的子节点是否全部选中

function isSelectAllChildNoes(node) {

var isSelectAll = true;

var childNodes = nodechildren;

if (childNodes) {

for (var i = 0; i < childNodeslength; i++) {

if (!isSelectNode(childNodes[i])) {

isSelectAll = false;

break;

}

}

}

return isSelectAll;

}

//改变节点的所有子节点状态（选中／取消选中）

function changeAllChildNoes(node, status) {

var childNodes = nodechildren;

if (childNodes) {

for (var i = 0; i < childNodeslength; i++) {

changeNode(childNodes[i], status);

changeAllChildNoes(childNodes[i], status);

}

}

}

//改变节点的所有父节点状态（选中／取消选中）

function changeAllParentNoes(node, status) {

var parentNode = nodegetParentNode();

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 (btnattr("checked")) {

var parentNode = treeNodegetParentNode();

if (!isSelectNode(parentNode)) {

changeNode(parentNode, true);

click_v1(parentNode);

}

}

}

//单选框改变状态所触发的事件

function click_v1(treeNode) {

if (treeNodetId != global_mark[treeNodetype]) {

var lastNode = treeObjgetNodeByTId(global_mark[treeNodetype]);

if (lastNode) {

changeAllChildNoes(lastNode, false);

}

global_mark[treeNodetype] = treeNodetId;

}

}

这样就实现了先前所提到的功能。

文章作者：iitshare

本文地址：>

你这个修改成这样就行了

ztree li spanbuttonswitchnoline_openlevel0{background-position:-94px -97px}

ztree li spanbuttonswitchnoline_closelevel0{background-position:-76px -97px}

~如果你认可我的回答，请及时点击采纳为满意回答按钮

~~手机提问的朋友在客户端右上角评价点满意即可。

~你的采纳是我前进的动力

~~O(∩_∩)O，记得好评和采纳，互相帮助，谢谢。

你的“还有一个问题就是当我选择一个后，在到另一个节点的子节点选择也能选中”是希望整个tree中只能选中一个节点么？那就设置check的radioType为all就好了，all代表整个whole tree里单选，而level只代表当前子树里单选

以上就是关于ztree中如何获得选中的checkbox的值全部的内容，包括:ztree中如何获得选中的checkbox的值、请问该怎么从iframe中获取父页面上的ztree对象、ztree如何实现真正的单选等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！