关闭

jQuery 实现简单全选、全不选、反选

943人阅读 评论(0) 收藏 举报
分类:

jQuery 实现简单全选、全不选、反选


<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>全选、全不选、反选</title>
	<style>
	</style>
</head>
<body>
	<div id="checkbox">
		<input type="checkbox">吃
		<input type="checkbox">喝
		<input type="checkbox">玩
		<input type="checkbox">乐
	</div>
	<div id="btn">
		<input type="button">全选
		<input type="button">全不选
		<input type="button">反选
	</div>


<script src="http://libs.baidu.com/jquery/1.7.0/jquery.js"></script>
<script>
	var checkAll = $('#btn>input').eq(0);
	var checkNone = $('#btn>input').eq(1);
	var checkReverse = $('#btn>input').eq(2);
	var checkbox = $('#checkbox>:checkbox');

	checkAll.click(function(){
		checkbox.attr('checked',true)
	})
	checkNone.click(function(){
		checkbox.attr('checked',false)
	})
	checkReverse.click(function(){
		checkbox.each(function(){
			$(this).attr('checked',!$(this).attr('checked'));
		});
	});
</script>
</body>
</html>
.....................................

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    文章分类