您的位置：首页 > Web前端 > JQuery

Jquery对checkbox操作，全选，取值

2010-12-16 10:13 686 查看

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/jquery-1.2.2.js"></script>
<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
$(function() {
$("#checkedAll").click(function() {
if ($(this).attr("checked") == true) { // 全选
$("input[name='month']").each(function() {
$(this).attr("checked", true);
});
} else { // 取消全选
$("input[name='month']").each(function() {
$(this).attr("checked", false);
});
}
});
$("input[name='month']").click(function(){
$("input[name='month']").each(function(){
var l=$("input[name='month']").length;
var a = true;
for(i=0;i<l;i++)
{
if($("input[name='month']")[i].checked==false)
{
a=false;
break;
}
}
if(a){
$("#checkedAll").attr("checked", true);
}else{
$("#checkedAll").attr("checked", false);
}
});
});
});

function query(){
$("input[name='month']").each(function(){
var l=$("input[name='month']").length;
var month="";
var k=0;
for(i=0;i<l;i++)
{
if($("input[name='month']")[i].checked==true)
{
if(k==0)
month+=$("input[name='month']")[i].value;
else
month+=","+$("input[name='month']")[i].value;
k++;
}
}
alert(month);
});

}
</script>
<body>
<input type="checkbox" name="checkedAll" id="checkedAll" />
<label for="checkedAll">
全选
</label>
<input type="checkbox" name="month" id="1" value="1" />
<label for="1">
1月
</label>
<input type="checkbox" name="month" id="2" value="2" />
<label for="2">
2月
</label>
<input type="checkbox" name="month" id="3" value="3" />
<label for="3">
3月
</label>
<input type="checkbox" name="month" id="4" value="4" />
<label for="4">
4月
</label>
<input type="checkbox" name="month" id="5" value="5" />
<label for="5">
5月
</label>
<input type="checkbox" name="month" id="6" value="6" />
<label for="6">
6月
</label>
<input type="checkbox" name="month" id="7" value="7" />
<label for="7">
7月
</label>
<input type="checkbox" name="month" id="8" value="8" />
<label for="8">
8月
</label>
<input type="checkbox" name="month" id="9" value="9" />
<label for="9">
9月
</label>
<input type="checkbox" name="month" id="10" value="10" />
<label for="10">
10月
</label>
<input type="checkbox" name="month" id="11" value="11" />
<label for="11">
11月
</label>
<input type="checkbox" name="month" id="12" value="12" />
<label for="12">
12月
</label>

<input type="button" onclick="query()" value="取值"/>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航