Javascript 实现TreeView CheckBox全选效果

复制代码 代码如下:

  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()");

  }