Javascript 实现TreeView CheckBox全选效果_javascript技巧
程序员文章站
2022-05-19 07:58:14
...
复制代码 代码如下:
function OnTreeNodeChecked() {
var ele = event.srcElement;
if (ele.type == 'checkbox') {
var childrenDivID = ele.id.replace('CheckBox', 'Nodes');
var div = document.getElementById(childrenDivID);
if (div != null) {
var checkBoxs = div.getElementsByTagName('INPUT');
for (var i = 0; i if (checkBoxs[i].type == 'checkbox')
checkBoxs[i].checked = ele.checked;
}
}
OnTreeNodeChildChecked(ele);
}
}
function OnTreeNodeChildChecked(ele) {
//自动处理上级
var parentDiv = ele.parentElement.parentElement.parentElement.parentElement.parentElement;
var parentChkBox = document.getElementById(parentDiv.id.replace('Nodes', 'CheckBox'));
if (parentChkBox != null) {
var ChildsChkAll = true;
var Boxs = parentDiv.getElementsByTagName('INPUT');
for (var i = 0; i if (Boxs[i].type == 'checkbox' && Boxs[i].checked == false) {
ChildsChkAll = false;
}
}
parentChkBox.checked = ChildsChkAll;
OnTreeNodeChildChecked(parentChkBox);
}
}
CS文件中注册JavaScript:
复制代码 代码如下:
void Page_Load(object sender,EventArgs e)
{
this.TreeView.Attribute.Add("onclick","OnTreeNodeChecked()");
}
推荐阅读
-
javascript 简单抽屉效果的实现代码_javascript技巧
-
复选框全选与全不选操作实现思路_javascript技巧
-
使用js实现雪花飘落效果_javascript技巧
-
原生javascript实现图片轮播效果代码_javascript技巧
-
js 判断checkbox是否选中的实现代码_javascript技巧
-
js实现同一页面多个运动效果的方法_javascript技巧
-
js仿百度有啊通栏展示效果实现代码_javascript技巧
-
javascript实现拖放效果_javascript技巧
-
JS+Canvas 实现下雨下雪效果_javascript技巧
-
js实现翻页后保持checkbox选中状态的实现方法_javascript技巧