树形菜单(checkbox列表)-- 设置checkbox的选中状态

 设置checkbox的选中状态

一个父节点可以包含0至多个一级子节点

 

<script type="text/javascript">

      /**//*
      * coding at 2009-03-14 by joe.yang
      */


      function checkBoxChanged(e) {
          var el = e.target || event.srcElement;
          var arrCheckBox = new Array();
          var index = 0;

          if (el.tagName == "INPUT" && el.type == "checkbox") {

              var divNode = el.parentNode.parentNode; // div
              var isParent = false;
              if (el.parentNode.getAttribute("flag") == "parent") {
                  isParent = true;
                  arrCheckBox[index++] = el;

                  arrCheckBox = getCheckBoxGroup(arrCheckBox, divNode, index);

              }
              else {
                  isParent = false;
                  index++;
                  arrCheckBox[index++] = el;

                  while (divNode.previousSibling != null) {


                      var preNode = divNode.previousSibling;
                      //处理空文本节点
                      while (preNode.nodeType == 3 || (preNode.nodeType == 1 && preNode.tagName != "DIV")) {
                          preNode = preNode.previousSibling;
                      }


                      var slibNode = preNode.getElementsByTagName("input");

                      if (slibNode.length == 0 ||
                        slibNode[0].type != "checkbox") {
                          break;
                      }

                      if (slibNode[0].parentNode.getAttribute("flag") == "parent") {
                          arrCheckBox[0] = slibNode[0];
                          break;
                      }
                      else {
                          arrCheckBox[index++] = slibNode[0];
                      }
                      divNode = slibNode[0].parentNode.parentNode;
                  }

                  divNode = el.parentNode.parentNode; // div

                  arrCheckBox = getCheckBoxGroup(arrCheckBox, divNode, index);

              }

              setCheckBox(arrCheckBox, isParent)

          }


      }

      function getCheckBoxGroup(arrCheckBox, divNode, index) {


          while (divNode.nextSibling != null) {
          
              var nexNode = divNode.nextSibling;
              //处理空文本节点(就算没文字内容，如果有换行，则该文本节点就是回车符)
              while (nexNode.nodeType == 3 || (nexNode.nodeType == 1 && nexNode.tagName != "DIV")) {
                  nexNode = nexNode.nextSibling;
              }

              var slibNode = nexNode.getElementsByTagName("input");

              if (slibNode.length == 0 || slibNode[0].parentNode.getAttribute("flag") == "parent" ||
                        slibNode[0].type != "checkbox") {
                  break;
              }

              arrCheckBox[index++] = slibNode[0];
              divNode = slibNode[0].parentNode.parentNode;
          }
          return arrCheckBox;
      }


      function setCheckBox(arrays, isParent) {
          var count = 0;
          for (var i = 1; i < arrays.length; i++) {
              if (isParent) {
                  arrays[i].checked = arrays[0].checked;
              }
              else {
                  if (arrays[i].checked) {
                      count++;
                  }
              }

          }

          if (!isParent) {
              if (arrays.length == count + 1) {
                  arrays[0].checked = true;
              }
              else {
                  arrays[0].checked = false;
              }
          }
      }
  </script>

 

 

---------

 父节点标记flag="parent"

子节点标记flag="child"

<form id="form1" runat="server">
    <div>
        <div>
            <asp:CheckBox ID="CheckBox1" runat="server" Text="CheckBox1" flag="parent" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox2" runat="server" flag="child" Text="CheckBox2" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox3" runat="server" flag="child" Text="CheckBox3" /></div>
        <div>
            <asp:CheckBox ID="CheckBox4" runat="server" Text="CheckBox4" flag="parent" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox5" runat="server" Text="CheckBox5" flag="child" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox6" runat="server" Text="CheckBox6" flag="child" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox7" runat="server" Text="CheckBox7" flag="child" /></div>
        <div>
            <asp:CheckBox ID="CheckBox8" runat="server" Text="CheckBox1" flag="parent" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox9" runat="server" flag="child" Text="CheckBox2" /></div>
        <div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:CheckBox ID="CheckBox10" runat="server" flag="child" Text="CheckBox3" /></div>
              <div>
            <asp:CheckBox ID="CheckBox11" runat="server" Text="CheckBox1" flag="parent" /></div>
              <div>
            <asp:CheckBox ID="CheckBox12" runat="server" Text="CheckBox1" flag="parent" /></div>
              <div>
            <asp:CheckBox ID="CheckBox13" runat="server" Text="CheckBox1" flag="parent" /></div>
     
    </div>
   
    </form>

 

 

 CheckBox1.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox2.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox3.Attributes.Add("onclick", "checkBoxChanged(event)");

                CheckBox4.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox5.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox6.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox7.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox8.Attributes.Add("onclick", "checkBoxChanged(event)");

                CheckBox9.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox10.Attributes.Add("onclick", "checkBoxChanged(event)");

                CheckBox11.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox12.Attributes.Add("onclick", "checkBoxChanged(event)");
                CheckBox13.Attributes.Add("onclick", "checkBoxChanged(event)");