js如何限制可以被选中复选框的个数:
在有些时候往往需要限制复选框可以被选中的个数，比如在一些对个人介绍的一些选项中，可能会有一些选项个数的限制，或者更形象的一个例子，当领取一些福利的时候，你不可能每一样都是可选的，都会有一些种类上的限制，下面就通过一个实例介绍一下如何实现此功能。
代码实例如下:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="author" content="http://www.softwhy.com/" />
<title>限定复选框的可选个数-蚂蚁部落</title>
</head>
<script language="javascript">
function checboxNum(name,num)
{
var checboxs=document.getElementsByName(name);
var a=0;
for(var i=0;i<checboxs.length;i++)
{
if(checboxs[i].checked)
{
a=a+1;
}
}
if(a==num)
{
for(var i=0;i<checboxs.length;i++)
{
if(!checboxs[i].checked)
{
checboxs[i].disabled='disabled';
}
}
}
else
{
for(var i=0;i<checboxs.length;i++)
checboxs[i].removeAttribute('disabled');
}
}
window.onload=function()
{
var box=document.getElementById("box");
box.onclick=function()
{
checboxNum("ck",3);
}
}
</script>
<body >
<div id="box">
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落一
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落二
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落三
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落四
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落五
<p></p>
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落六
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落七
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落八
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落九
<label><input type="checkbox" name="ck" width="30px;"/></label>蚂蚁部落十
</div>
</body>
</html>
以上代码实现了我们的要求，可以规定能够选中的复选框的数量，当达到这个数量之后，其他的复选框将会被设置为不可用状态，下面简单介绍一下实现过程。
一.实现原理:
效果看起来不错，原理其实非常的简单，就是为checkbox的父元素div注册onclick事件处理函数，当点击选中复选框的时候就会触发onclick事件，然后通过事件冒泡现象传递到div父元素，这样就会执行事件处理函数。在函数中，会遍历所有的复选框，每选中一个变量a就会+1，如果数量到达规定的数量，除了被选中的复选框之外，其他的复选框都会被设置为不可用。
二.代码注释:
1.function checboxNum(name,num){}，div的onclick事件处理函数，name是复选框的name属性值，num是可以选中的数量。
2.var checboxs=document.getElementsByName(name)，获取复选框对象集合。
3. var a=0，声明一个变量a，并赋初值0.
4.for(var i=0;i<checboxs.length;i++),遍历所有的复选框。
5.if(checboxs.checked)，如果复选框被选中。
6.a=a+1，a的值+1。
7.if(a==num)，如果a的值达到规定的可选数量。
8.for(var i=0;i<checboxs.length;i++) ，遍历所有的复选框。
9.if(!checboxs.checked)，如果复选框没有被选中。
10.checboxs.disabled='disabled'，将没有被选中的设置为不可用。
11.for(var i=0;i<checboxs.length;i++) ，遍历复选框。
12.checboxs.removeAttribute('disabled')，将复选框设置为可用。
13.window.onload=function(){},文档内容完全加载完毕再去执行函数中的代码。
14.var box=document.getElementById("box")，获取div对象。
15.box.onclick=function()，为div对象注册事件处理函数。
三.相关阅读:
1.getElementsByName()函数可以参阅javascript的document.getElementsByName()方法一章节。
2.checked属性可以参阅javascript的checkbox.checked属性一章节。
3.disabled属性可以参阅javascript的checkbox.disabled属性一章节。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=8886
更多内容可以参阅:http://www.softwhy.com/javascript/