当前位置： 代码迷 >> Web前端 >> jQuery兑现CheckBox的全选与反选
  详细解决方案

jQuery兑现CheckBox的全选与反选

热度：49   发布时间：2012-07-22 19:31:18.0
jQuery实现CheckBox的全选与反选
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>jQuery实现CheckBox全选与反选</title>
<script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script>    
<script type="text/javascript">
	$(function() {
		$("#checkboxAll").click(function() {
			$('input[name="boxList"]').attr("checked",this.checked); 
		});
		var $boxList = $("input[name='boxList']");
		$boxList.click(function(){
			$("#checkboxAll").attr("checked",$boxList.length == $("input[name='boxList']:checked").length ? true : false);
		});
	});
</script>
</head>
<body>
	<div>
		<input type="checkbox" id="checkboxAll" />全选
		<input type="checkbox" name="boxList" />测试1
		<input type="checkbox" name="boxList" />测试2
		<input type="checkbox" name="boxList" />测试3
		<input type="checkbox" name="boxList" />测试4
	</div>
</body>
</html>
  相关解决方案

代码迷 - 您身边的软件异常，代码异常，编程异常助手（发现，解决，分享）
Copyright © 2009-2013 DAIMAMI.COM. All rights reserved.