XML/HTML code? <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <script type="text/javascript"> function getElementsByClassName(className, element) { var children = (element || document).getElementsByTagName('*'); var elements = new Array(); for (var i = 0; i < children.length; i++) { var child = children[i]; var classNames = child.className.split(' '); for (var j = 0; j < classNames.length; j++) { if (classNames[j] == className) { elements.push(child); break; } } } return elements; } function checkAllChild(parent,tar){ var self = arguments.callee; var parentId = parent.id.split('-')[1]; var childClass = 'child-of-node-'+parentId; var tarOption = tar.getAttribute('option'); var childTr = getElementsByClassName(childClass,table),len=childTr.length; for(var i=0;i<len;i++){ var childId = childTr[i].id.split('-')[1]; var shouldCheckName = 'ids['+childId+']['+tarOption+']'; var checkes = document.getElementsByName(shouldCheckName); var inputlen = checkes.length; for(var j=0;j<inputlen;j++){ checkes[j].checked = tar.checked; } var hasChild = getElementsByClassName('child-of-node-'+childId,table).length==0 ? false : true; if(hasChild){ self(childTr[i],tar); } } } window.onload = function(){ var table = document.getElementById('table'); table.onclick = function(e){ e = e || window.event; var tar = e.target || e.srcElement; if(tar.tagName!='INPUT'){ return; } if(tar.type!='checkbox'){ return; } var parent = tar.parentNode.parentNode; checkAllChild(parent,tar); } } </script> <table id="table"> <tr id="node-1"> <td>总类一</td> <td><input class="inputcheckbox" type="checkbox" name="ids[1][1]" option="1"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[1][2]" option="2"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[1][3]" option="3"/> 选项3 </tr> <tr id="node-10" class="child-of-node-1"> <td>总类一 分类一</td> <td><input class="inputcheckbox" type="checkbox" name="ids[10][1]"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[10][2]"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[10][3]"/> 选项3 </tr> <tr id="node-11" class="child-of-node-1"> <td>总类一 分类二</td> <td><input class="inputcheckbox" type="checkbox" name="ids[11][1]" option="1"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[11][2]" option="2"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[11][3]" option="3"/> 选项3 </tr> <tr id="node-110" class="child-of-node-11"> <td>总类一 分类二 分类1</td> <td><input class="inputcheckbox" type="checkbox" name="ids[110][1]" option="1"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[110][2]" option="2"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[110][3]" option="3"/> 选项3 </tr> <tr id="node-112" class="child-of-node-110"> <td>总类一 分类二 分类1 分类A</td> <td><input class="inputcheckbox" type="checkbox" name="ids[112][1]"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[112][2]"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[112][3]"/> 选项3 </tr> <tr id="node-2"> <td>总类二</td> <td><input class="inputcheckbox" type="checkbox" name="ids[2][1]" option="1"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[2][2]" option="2"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[2][3]" option="3"/> 选项3 </tr> <tr id="node-20" class="child-of-node-2"> <td>总类二 分类一</td> <td><input class="inputcheckbox" type="checkbox" name="ids[20][1]"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[20][2]"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[20][3]"/> 选项3 </tr> <tr id="node-3"> <td>总类二</td> <td><input class="inputcheckbox" type="checkbox" name="ids[3][1]"/> 选项1 <td><input class="inputcheckbox" type="checkbox" name="ids[3][2]"/> 选项2 <td><input class="inputcheckbox" type="checkbox" name="ids[3][3]"/> 选项3 </tr> </table>
上一页 [1] [2]