Javascript 实现TreeView CheckBox全选效果
Javascript 实现TreeView CheckBox全选效果
发布时间:2016-12-30 来源:查字典编辑
摘要:复制代码代码如下:functionOnTreeNodeChecked(){varele=event.srcElement;if(ele.ty...

复制代码 代码如下:

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 < checkBoxs.length; 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 < Boxs.length; 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教程学习
编程开发子分类