层级结构。。很辛苦的思考了好久。。终于明白了。。
<script type="text/javascript"> $(document).ready(function(){ $(".dlei").click(function () { if($(this).attr("checked")==true){ $("."+$(this).attr("id")).fadeIn();//查找子节点显示 }else{ $("."+$(this).attr("id")).hide();//查找子节点隐藏 } }); $(".erlei").click(function () { if($(this).attr("checked")==true){ $("."+$(this).attr("id")).fadeIn(); }else{ $("."+$(this).attr("id")).hide(); $("."+$(this).attr("id")+" .sanlei").attr("checked",false);//查找子节点取消勾选 $("."+$(this).attr("id")+" .siji").attr("checked",false);//查找孙节点取消勾选 } }); $(".sanlei").click(function () { if($(this).attr("checked")==true){ $("."+$(this).attr("id")).fadeIn(); var sanjizhaoerji=$(this).parent().attr("class");//查找父节点名字 $("#"+sanjizhaoerji).attr("checked",true);//勾选父节点 }else{ $("."+$(this).attr("id")).hide(); $("."+$(this).attr("id")+" .siji").attr("checked",false);//查找子节点。取消勾选 } }); }); </script>
<span style=" color:#F00"><%=rp("BigClass")%></span> <input name="class1" type="checkbox" class="dlei" id="checkbox_<%=rp("id")%>" value="<%=rp("BigClass")%>"<%if instr(class1,rp("BigClass"))>0 and class1<>"" then %> checked="checked"<%end if%> /><br /> <div class="checkbox_<%=rp("id")%>" style="display:none"> ∟—<span style=" color:#360"><%=rpt("SecClass")%></span> <input name="class2" type="checkbox" class="erlei" id="c_<%=rpt("id")%>" value="<%=rpt("SecClass")%>" <%if instr(class2,rpt("SecClass"))>0 and class2<>"" then %> checked="checked"<%end if%> /><br /> <div class="c_<%=rpt("id")%>" style="display:none"> ∟—<span style=" color:#009"><%=rpf("ThiClass")%></span> <input name="class3" class="sanlei" type="checkbox" id="e_<%=rpf("id")%>" value="<%=rpf("ThiClass")%>"<%if instr(class3,rpf("ThiClass"))>0 and class3<>"" then %> checked="checked"<%end if%> /><br /> <div class="e_<%=rpf("id")%>" style="display:none"> ∟—<span style="color:#300"><%=rpe("FouClass")%></span> <input name="class4" class="siji" type="checkbox" value="<%=rpe("FouClass")%>" <%if instr(class4,rpe("FouClass"))>0 and class4<>"" then %> checked="checked"<%end if%> /> </div> </div> </div>
节点的练习