<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
<body>
<input type="checkbox" />体育<br />
<input type="checkbox" />音乐<br />
<input type="checkbox" />美食<br />
<input type="checkbox" />科技<br />
<input type="checkbox" />健身<br />
<input type="checkbox" />娱乐<br />
<input type="checkbox" />政治<br />
<input type="checkbox" />汽车<br />
<input type="checkbox" />游戏<br />
<input type="checkbox" />摄影<br />
<button>全选</button>
<button>全不选</button>
<button>反选</button>
</body>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<script>
$(function() {
$('button:first').click(function() {
// 此方式只能选择一次，再次选择会出问题
//$(':checkbox').attr('checked', true)
$(':checkbox').prop('checked', true)
})
$('button:eq(1)').click(function() {
//$(':checkbox').attr('checked', false)
$(':checkbox').prop('checked', false)
})
$('button:last').click(function() {
// 将每一个匹配的元素作为回调函数的上下文执行
$(':checkbox').each(function() {
// 获取当前的选择状态，然后取反
var checked = !$(this).prop('checked')
// 重新设置选中状态
$(this).prop('checked', checked)
})
})
})
</script>
</html>
1538
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
