父类

复制代码 代码如下:

<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 多选框 联动实现代码】相关文章：

★ JQuery中层次选择器用法实例详解

★ Javascript 字符串模板的简单实现

★ javascript常用的方法分享

★ CheckBox 如何实现全选？

★ JavaScript实现身份证验证代码

★ Jquery中基本选择器用法实例详解

★ 鼠标图片振动代码

★ Js和JQuery获取鼠标指针坐标的实现代码分享

★ js实现异步循环实现代码

★ 带Checkbox的列表框