zoukankan      html  css  js  c++  java
  • 脚本全选全不选操作asp.net treeview控件

      1 //树节点勾选(取消)上级自动全部勾选(取消)下级,勾选下级自动勾选上级,取消全部下级,自动取消上级
      2 
      3          //事件响应函数
      4          var HandleCheckbox = function () {
      5              //取得事件触发的元素,因为只要点了树控件,就会触发这个函数,所以须判断:只有点击checkbox时才继续
      6              var element = event.srcElement;
      7              if (element.tagName == "INPUT" && element.type == "checkbox") {
      8                  var checkedState = element.checked;
      9                  //取到checkbox的上级table。微软TreeView树是以每个同级节点以一个div包裹一个table再包裹input形式存在的
     10                  while (element.tagName != "TABLE") {
     11                      element = element.parentElement;
     12                  }
     13                  var parentElement = element;
     14 
     15                  //如果checkbox被选中的话,要判断父级checkbox是否应该被自动选中
     16                  if (checkedState) {
     17                      CheckParents(element);
     18                  }
     19 
     20                  //取到元素的父级元素的同一层级的后面的元素
     21                  element = element.nextSibling;
     22 
     23                  if (element != null) {
     24                      var childTables = element.getElementsByTagName("TABLE");
     25 
     26                      for (var tableIndex = 0; tableIndex < childTables.length; tableIndex++) {
     27                          CheckTable(childTables[tableIndex], checkedState);
     28                      }
     29                  }
     30                  if (checkedState == false) {
     31                      UnCheckParents(parentElement);
     32                  }
     33 
     34              }
     35          }
     36          //判断并勾选父级checkbox
     37          function CheckParents(table) {
     38              //首先判断元素有没有checkbox,table的列为三即有为二就没有
     39              if (table == null || table.rows[0].cells.length == 2) // This is the root 
     40              {
     41                  return;
     42              }
     43              //取到元素的父级元素的同一层级的前面的元素
     44              var parentTable = table.parentElement.previousSibling;
     45              var checkedCount = GetCheckedCount(table.parentElement);
     46              var childCount = GetChildrenCount(table.parentElement);
     47              if (checkedCount == childCount) {
     48                  //勾选父级元素
     49                  CheckTable(parentTable, true);
     50              }
     51              //迭代函数
     52              CheckParents(parentTable);
     53          }
     54 
     55          //判断并取消父级checkbox 
     56          function UnCheckParents(table) {
     57 
     58              if (table == null || table.rows[0].cells.length == 2) // This is the root  
     59              {
     60                  return;
     61              }
     62              var parentTable = table.parentElement.previousSibling;
     63              //判断子节点的选中个数
     64              //判断子节点的选中个数
     65              var checkedCount = GetCheckedCount(table.parentElement);
     66              var childCount = GetChildrenCount(table.parentElement);
     67              if (checkedCount < childCount) {
     68                  CheckTable(parentTable, false);
     69              }
     70              //迭代
     71              UnCheckParents(parentTable);
     72          }
     73 
     74          // 勾选或取消checkbox                                   
     75          function CheckTable(table, checked) {
     76              //以保证取到table的行的最后一列(TreeView解压出来是将input放在table行的最后一列)
     77              var checkboxIndex = table.rows[0].cells.length - 1;
     78              var cell = table.rows[0].cells[checkboxIndex];
     79              //取到checkbox
     80              var checkboxes = cell.getElementsByTagName("INPUT");
     81              if (checkboxes.length == 1) {
     82                  checkboxes[0].checked = checked;
     83              }
     84 
     85          }
     86 
     87          //判断子节点个数
     88          function GetChildrenCount(table) {
     89              var checkedCount = 0;
     90              var element = table.nextSibling;
     91              var childTable = table.getElementsByTagName("TABLE");
     92 
     93              for (var tableIndex = 0; tableIndex < childTable.length; tableIndex++) {
     94                  var childTables = childTable[tableIndex];
     95                  var checkboxIndex = childTables.rows[0].cells.length - 1;
     96                  var cell = childTables.rows[0].cells[checkboxIndex];
     97                  var checkboxes = cell.getElementsByTagName("INPUT");
     98                  if (checkboxes.length == 1) {
     99                      checkedCount++;
    100                  }
    101              }
    102              return checkedCount;
    103          }           
    104          //判断子节点的选中个数
    105          function GetCheckedCount(table) {
    106              var checkedCount = 0;
    107              var element = table.nextSibling;
    108              var childTable = table.getElementsByTagName("TABLE");
    109 
    110              for (var tableIndex = 0; tableIndex < childTable.length; tableIndex++) {
    111                  var childTables = childTable[tableIndex];
    112                  var checkboxIndex = childTables.rows[0].cells.length - 1;
    113                  var cell = childTables.rows[0].cells[checkboxIndex];
    114                  var checkboxes = cell.getElementsByTagName("INPUT");
    115                  if (checkboxes.length == 1 && checkboxes[0].checked == true) {
    116                      checkedCount++;
    117                  }
    118              }
    119              return checkedCount;
    120          }     

    调用的时候直接调用

    HandleCheckbox就可以了
  • 相关阅读:
    activemq安装及使用
    匿名内部类的简单使用
    Struts2中动态方法调用
    重定向和转发的区别
    result转发到一个action
    在Android Studio中导入jar包
    架构文档类别
    Linux/Unix下pid文件的作用
    【8.21校内测试】【最大生成树】【树状数组】【数学】
    【BZOJ】2653: middle
  • 原文地址:https://www.cnblogs.com/wenpeng/p/4019119.html
Copyright © 2011-2022 走看看