权限树中Checkbox的操作

最新推荐文章于 2025-08-22 11:32:18 发布

原创最新推荐文章于 2025-08-22 11:32:18 发布 · 568 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#function #javascript #input #null #asp.net #div

dotnet 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何利用ASP.NET的TreeView控件结合JavaScript实现权限树功能，包括节点可访问时其父节点和子节点的状态更新。通过具体代码示例展示了如何设置节点状态及其传播。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里使用asp.net的TreeView控件结合JavaScript实现权限树的部分功能。
　　假设权限树中有如下三条规则：
　　1、该节点可以访问，则他的父节点也必能访问；
　　2、该节点可以访问，则他的子节点也都能访问；
　　3、该节点不可访问，则他的子节点也不能访问。

前台页面的JavaScript代码如下：
//获取元素指定tagName的父元素 function public_GetParentByTagName(element, tagName) { var parent = element.parentNode; var upperTagName = tagName.toUpperCase(); //如果这个元素还不是想要的tag就继续上溯 while (parent && (parent.tagName.toUpperCase() != upperTagName)) { parent = parent.parentNode ? parent.parentNode : parent.parentElement; } return parent; } //设置节点的父节点Cheched——该节点可访问，则他的父节点也必能访问 function setParentChecked(objNode) { var objParentDiv = public_GetParentByTagName(objNode,"div"); if(objParentDiv==null || objParentDiv == "undefined") { return; } var objID = objParentDiv.getAttribute("ID"); objID = objID.substring(0,objID.indexOf("Nodes")); objID = objID+"CheckBox"; var objParentCheckBox = document.getElementById(objID); if(objParentCheckBox==null || objParentCheckBox == "undefined") { return; } if(objParentCheckBox.tagName!="INPUT" && objParentCheckBox.type == "checkbox") return; objParentCheckBox.checked = true; setParentChecked(objParentCheckBox); } //设置节点的子节点uncheched——该节点不可访问，则他的子节点也不能访问 function setChildUnChecked(divID) { var objchild = divID.children; var count = objchild.length; for(var i=0;i<objchild.length;i++) { var tempObj = objchild[i]; if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox") { tempObj.checked = false; } setChildUnChecked(tempObj); } } //设置节点的子节点cheched——该节点可以访问，则他的子节点也都能访问 function setChildChecked(divID) { var objchild = divID.children; var count = objchild.length; for(var i=0;i<objchild.length;i++) { var tempObj = objchild[i]; if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox") { tempObj.checked = true; } setChildChecked(tempObj); } } //触发事件 function CheckEvent() { var objNode = event.srcElement; if(objNode.tagName!="INPUT" || objNode.type!="checkbox") return; if(objNode.checked==true) { setParentChecked(objNode); var objID = objNode.getAttribute("ID"); var objID = objID.substring(0,objID.indexOf("CheckBox")); var objParentDiv = document.getElementById(objID+"Nodes"); if(objParentDiv==null || objParentDiv == "undefined") { return; } setChildChecked(objParentDiv); } else { var objID = objNode.getAttribute("ID"); var objID = objID.substring(0,objID.indexOf("CheckBox")); var objParentDiv = document.getElementById(objID+"Nodes"); if(objParentDiv==null || objParentDiv == "undefined") { return; } setChildUnChecked(objParentDiv); } }

然后在page_load事件中将TreeView与js事件绑定上：
this.TreeView1.Attributes.Add("onclick", "CheckEvent()");