Posted in Javascript onOctober 22, 2008
父类
<input type="checkbox" name="father" forcheckboxgroup="groupname1"/>
子类
<input type="checkbox" name="son" group="groupname1"/>
实现代码
<script type="text/javascript"> function CheckboxGroup(){ var arrelement = document.all; var i=0; while(i<arrelement.length){ var forgroupattrib = arrelement[i].getAttribute('forcheckboxgroup'); if(forgroupattrib != null && forgroupattrib != ''){ arrelement[i].setAttribute('groupmember',_getGroupMember(arrelement[i])); if(arrelement[i].tagName.toLowerCase() == 'input' && arrelement[i].type == 'checkbox'){ arrelement[i].onclick=function(){ //----------------------Checked All------------------ var groupmember = this.getAttribute('groupmember'); var i = 0; while(i<groupmember.length){ groupmember[i].checked = this.checked; i++; } //--------------------------------------------------- } } _setState(arrelement[i]); } i++; } } function _getGroupMember(o){ var groupname = o.getAttribute('forcheckboxgroup'); var items = new Array; var inputs = document.getElementsByTagName('input'); var i=0; while(i<inputs.length){ if(inputs[i].type == 'checkbox'){ var groupattrib = inputs[i].getAttribute('group'); if(groupattrib == groupname){ items[items.length] = inputs[i]; var master = inputs[i].getAttribute('groupmaster'); if (master == null) { master = new Array; master[0] = o.uniqueID; inputs[i].setAttribute('groupmaster', master); } else{ master[master.length] = o.uniqueID; } inputs[i].onpropertychange = function(){ if (event.propertyName == 'checked') { var arro = this.getAttribute('groupmaster'); var i = 0; while (i < arro.length) { _setState(document.getElementById(arro[i])); i++; } } } } } i++; } return items; } function _setState(o){ var master = o; if(master!=null){ var chkselall = true; var chknosel = true; var groupmember = master.getAttribute('groupmember'); var i = 0; while(i<groupmember.length){ if(chkselall)chkselall = groupmember[i].checked; if(chknosel)chknosel = !groupmember[i].checked; i++; } if(master.tagName.toLowerCase() == 'input'&&master.type=='checkbox'){ if (chkselall) { master.indeterminate = false; master.checked = true; } if (chknosel) { master.indeterminate = false; master.checked = false; } if(!chkselall&&!chknosel)master.indeterminate = true; } else{ master.disabled = chknosel; } } } window.attachEvent('onload',CheckboxGroup); </script>
checkbox 多选框 联动实现代码
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@