jquery统计用户选中的复选框的个数
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>jquerytest</title>
<scriptsrc="jquery-1.11.1.min.js"></script>
</head>
<body>
<inputtype="checkbox"name="check"value="one"/>one<br/>
<inputtype="checkbox"name="check"value="two"/>two<br/>
<inputtype="checkbox"name="check"value="three"/>three<br/>
<inputtype="checkbox"name="check"value="four"/>four<br/>
<inputtype="checkbox"name="check"value="five"/>five<br/>
<inputtype="checkbox"name="check"value="six"/>six<br/>
<inputtype="checkbox"name="check"value="seven"/>seven<br/>
<buttonname="sub">提交</button>
<scripttype="text/javascript">
$("button[name=sub]").click(function(){
varlen=$("input:checkbox:checked").length;
alert("你一共选中了"+len+"个复选框");
})
</script>
</body>
</html>
使用选择器得到所有被勾选的复选框元素的集合,然后通过判断元素的个数来得到用户勾选的个数。
有的时候,我们还对用户勾选复选框的个数做了限制,假设只能勾选三个,相应的代码是这样的:
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>jquerytest</title>
<scriptsrc="jquery-1.11.1.min.js"></script>
</head>
<body>
<inputtype="checkbox"name="check"value="one"/>one<br/>
<inputtype="checkbox"name="check"value="two"/>two<br/>
<inputtype="checkbox"name="check"value="three"/>three<br/>
<inputtype="checkbox"name="check"value="four"/>four<br/>
<inputtype="checkbox"name="check"value="five"/>five<br/>
<inputtype="checkbox"name="check"value="six"/>six<br/>
<inputtype="checkbox"name="check"value="seven"/>seven<br/>
<scripttype="text/javascript">
$("input:checkbox").click(function(){
varlen=$("input:checkbox:checked").length;
if(len>3){
alert('亲,最多只能选三个哟~');
returnfalse;//另刚才勾选的取消
}
})
</script>
</body>
</html>