日期:2014-05-16  浏览次数:20317 次

javascript应用:实现复选框全选/全不选切换

?经常有人问起在网页里实现多选框的全选功能,今天我就写了这么一个DEMO

<input type=checkbox name=mm value=a onclick="checkItem(this, 'mmAll')"><br>
<input type=checkbox name=mm value=b onclick="checkItem(this, 'mmAll')"><br>
<input type=checkbox name=mm value=c onclick="checkItem(this, 'mmAll')"><br>
<input type=checkbox name=mm value=d onclick="checkItem(this, 'mmAll')"><br>
<input type=checkbox name=mm value=e onclick="checkItem(this, 'mmAll')"><br><br>
<input type=checkbox name=mmAll onclick="checkAll(this, 'mm')">全选与不全选的切换

<script language=Javascript>
function checkAll(e, itemName)
{
? var aa = document.getElementsByName(itemName);
? for (var i=0; i<aa.length; i++)
?? aa[i].checked = e.checked;
}
function checkItem(e, allName)
{
? var all = document.getElementsByName(allName)[0];
? if(!e.checked) all.checked = false;
? else
? {
??? var aa = document.getElementsByName(e.name);
??? for (var i=0; i<aa.length; i++)
???? if(!aa[i].checked) return;
??? all.checked = true;
? }
}
</script>

1 楼 张振方 2009-03-28  
曾经见到一个也是解决全选/全不选的问题,但是他那个全选checkbox不会随着子checkbox是否全选改变,楼主这个写的很美!