使用JQuery表单选择器,实现全选/全不选/和反选的效果
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-1.8.3.js">
</script>
<script type="text/javascript">
function test() {
if($("#allLike").val() == "都喜欢") {
$(":checkbox").attr("checked", true);
$("#allLike").val("都不喜欢");
} else {
$(":checkbox").attr("checked", false);
$("#allLike").val("都喜欢");
}
}
function untest () {
$(":checkbox").each(function(){
$(this).attr("checked",!$(this).attr("checked"));
})
}
</script>
<title></title>
</head>
<body>
<h3>请您选出最喜欢做的事(点击按钮看看会有什么效果......)</h3>
<hr/>
<input type="checkbox" name="" id="1" value="" />游泳<br>
<input type="checkbox" name="" id="" value="" />看书<br>
<input type="checkbox" name="" id="" value="" />看电影<br>
<input type="checkbox" name="" id="" value="" />旅游<br>
<input type="checkbox" name="" id="" value="" />计算机<br />
<input type="button" name="" id="allLike" value="都喜欢" onclick="test()" />
<input type="button" name="" id="" value="反选" onclick="untest()" />
</body>
</html>