请教一个JS CheckBox多级级联的写法，用Jquery实现最好！谢谢！

本人的JS水平实在太差了，最近在项目中需要用到 JS 多级级联选择的应用，请教下 checkbox的实现代码，谢谢各位了，感激不尽！

解决方案 »

  1.   

    ....就是在网上没找着合适的，所以才来CSDN请教啊我都找了好几天了，都不咋滴
      

  2.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>checkboxCascade.html</title>

        <meta http-equiv="author" content="blog.csdn.net/IBM_hoojo">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
    <script type="text/javascript">
    var $ = function (id) {
    return document.getElementById(id);
    }  var checkedBox = function (id, isChecked, childLength) {
    for (var i = 1; i <= childLength; i++) {
    if (!!$(id + i)) {
    if (isChecked) {
    $(id + i).setAttribute("checked", "checked");
    checkedBox($(id + i).id + "_", $(id + i).checked, 4);
    } else {
    $(id + i).setAttribute("checked", false);
    $(id + i).removeAttribute("checked");
    checkedBox($(id + i).id + "_", $(id + i).checked, 4);
    }
    }
    }
    };

    window.onload = function () {
    $("box1").onclick = function () {
    checkedBox(this.id + "_", this.checked, 4);
    }; $("box2").onclick = function () {
    checkedBox(this.id + "_", this.checked, 4);
    };

    for (var i = 1; i <= 4; i++) {
    $("box1_" + i).onclick = function () {
    checkedBox(this.id + "_", this.checked, 3);
    }; $("box2_" + i).onclick = function () {
    checkedBox(this.id + "_", this.checked, 3);
    };
    } };
    </script>
      </head>
      
      <body>
        <input type="checkbox" id="box1"/>Java
        <input type="checkbox" id="box2"/>.Net
        <hr/>
        <input type="checkbox" id="box1_1"/>Spring
        <input type="checkbox" id="box1_2"/>Struts
        <input type="checkbox" id="box1_3"/>Hibernate
        <input type="checkbox" id="box1_4"/>MyBatis
        <br/>
        <input type="checkbox" id="box2_1"/>Net Spring
        <input type="checkbox" id="box2_2"/>Net Struts
        <input type="checkbox" id="box2_3"/>NHibernate
        <input type="checkbox" id="box2_4"/>Net MyBatis
        <hr/>
        <input type="checkbox" id="box1_1_1"/>Spring v2.0
        <input type="checkbox" id="box1_1_2"/>Spring v2.5
        <input type="checkbox" id="box1_1_3"/>Spring v3.0
        <br/>
        <input type="checkbox" id="box1_2_1"/>Struts v1.x
        <input type="checkbox" id="box1_2_2"/>Struts v2.x
        <hr/>
        <input type="checkbox" id="box2_1_1"/>Net Spring v2.0
        <input type="checkbox" id="box2_1_2"/>Net Spring v2.5
        <input type="checkbox" id="box2_1_3"/>Net Spring v3.0
        <br/>
        <input type="checkbox" id="box2_2_1"/>Net Struts v1.x
        <input type="checkbox" id="box2_2_2"/>Net Struts v2.x
      </body>
    </html>
    基本思路就这样，你可以看看。不符合的可以自己改改
      

  3.   


    function CheckAll(flag)
      {
      var table = document.getElementById("<%=Repeater1.ClientID %>");
      var inputs = table.getElementsByTagName("input");
      for(var i=0;i<inputs.length;i++){
      if(inputs[i].type=="checkbox"){
      inputs[i].checked= true;
      }
      }
      }
      --------------------
      
      <script type="text/javascript" src="Scripts/jquery-1.3.2.js">
        </script>
        <script type="text/javascript">
            $(function() {
                $("#checkbox1").click(function() {
                    if ($(this).is(":checked")) {
                        $("#select1").show();
                    }
                    else {
                        $("#select1").hide();
                    }
                });
            });
        </script>--------function SelectAll(chkbox)
    {
       var box=chkbox;
       state=theBox.checked;    
       elem=box.form.elements;
       for(i=0;i<elem.length;i++)
       if(elem[i].type=="checkbox" && elem[i].id!=box.id)
        {
             if(elem[i].checked!=state)
             {
                elem[i].click();
             }
        }
     }
       <input id="chkAll"  onclick="SelectAll(this)"; type=checkbox>