checkbox 多选框 联动实现代码
checkbox 多选框 联动实现代码
发布时间:2016-12-30 来源:查字典编辑
摘要:父类复制代码代码如下:子类复制代码代码如下:实现代码复制代码代码如下:functionCheckboxGroup(){vararreleme...

父类

复制代码 代码如下:

<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>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类