码迷,mamicode.com
首页 > Web开发 > 详细

jQuery全选

时间:2016-05-16 09:22:46      阅读:151      评论:0      收藏:0      [点我收藏+]

标签:

表单

<input type="checkbox" id="all" /> 全选<br />
<input class="t" type="checkbox" value="aa" /> aa
<input class="t" type="checkbox" value="bb" /> bb
<input class="t" type="checkbox" value="cc" /> cc
<input class="t" type="checkbox" value="dd" /> dd
<input class="t" type="checkbox" value="ee" /> ee

<input type="button" value="测试" id="btn" />
<input type="text" id="txt" />
<input type="button" value="设置选中" id="sel" />

 jQuery

<script type="text/javascript">

$(document).ready(function(e) {
    
	//全选
	$("#all").click(function(){
		
		var ck = $(".t");
		var xz = $(this)[0].checked;
		
		ck.prop("checked",xz);
		
		})
	
	//取选中项的值
	$("#btn").click(function(){
		
		var ck = $(".t");
		for(var i=0; i<ck.length;i++)
		{
			if(ck.eq(i).prop("checked"))        //ck.eq(i)[0].checked
			{
				alert(ck.eq(i).val());
			}
		}
		
		})
		
	//设置某项选中
	$("#sel").click(function(){
		
		var v = $("#txt").val();
		
		var ck = $(".t");
		ck.prop("checked",false);
		for(var i=0;i<ck.length;i++)
		{
			if(ck.eq(i).val()==v)
			{
				ck.eq(i).prop("checked",true);
			}
		}
		
		})
	
	
	
});

</script>

  

jQuery全选

标签:

原文地址:http://www.cnblogs.com/1116zsc/p/5496871.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!