1.不带选项框
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选全不选1(空白)</title>
<script type="text/javascript" src="static/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
/*
功能需求：
*/
$(function(){
$("#checkedAllBtn").click(function(){
//①全选按钮：点击后所有爱好都选中 设置的属性值相同
$("input[name='items']").attr("checked" , true);//隐式迭代
});
$("#checkedNoBtn").click(function(){
//②全不选按钮：点击后所有爱好都不选中
$("input[name='items']").attr("checked" , false);//隐式迭代
});
$("#checkedRevBtn").click(function(){
//反选按钮：选中变为未选中，未选中变为选中
$("input[name='items']").each(function(){
//alert(this.checked);//正在遍历的dom对象
this.checked = !this.checked;
});//设置不同的值 无法隐式迭代
});
$("#sendBtn").click(function(){
//④提交按钮：点击后依次弹出选中内容
//获取选中的复选框
$("[name='items']:checked").each(function(){
alert(this.value);
});
});
});
</script>
</head>
<body>
<form method="post" action="">
熟悉的编程语言是：
<br />
<input type="checkbox" name="items" value="C语言" />C语言
<input type="checkbox" name="items" value="C++语言" />C++语言
<input type="checkbox" name="items" value="python语言" />python语言
<input type="checkbox" name="items" value="Java语言" />Java语言
<br />
<input type="button" id="checkedAllBtn" value="全 选" />
<input type="button" id="checkedNoBtn" value="全不选" />
<input type="button" id="checkedRevBtn" value="反 选" />
<input type="button" id="sendBtn" value="提 交" />
</form>
</body>
</html>