Jquery选择复选框操作

浏览数：36 / 时间：2015年06月09日

 1 <script type="text/javascript">
 2 jQuery(function($){
 3 //全选
 4 $("#btn1").click(function(){
 5 $("input[name=‘checkbox‘]").attr("checked","true");
 6 })
 7 //取消全选
 8 $("#btn2").click(function(){
 9 $("input[name=‘checkbox‘]").removeAttr("checked");
10 })
11 //选中所有基数
12 $("#btn3").click(function(){
13 $("input[name=‘checkbox‘]:even").attr("checked","true");
14 })
15 //选中所有偶数
16 $("#btn6").click(function(){
17 $("input[name=‘checkbox‘]:odd").attr("checked","true");
18 })
19 //反选
20 $("#btn4").click(function(){
21 $("input[name=‘checkbox‘]").each(function(){
22 if($(this).attr("checked"))
23 {
24 $(this).removeAttr("checked");
25 }
26 else
27 {
28 $(this).attr("checked","true");
29 }
30 })
31 })
32 //或许选择项的值
33 var aa="";
34 $("#btn5").click(function(){
35 $("input[name=‘checkbox‘]:checkbox:checked").each(function(){
36 aa+=$(this).val()
37 })
38 document.write(aa);
39 })
40 })

 1 <form id="form1" runat="server">
 2 <div>
 3 <input type="button" id="btn1" value="全选">
 4 <input type="button" id="btn2" value="取消全选">
 5 <input type="button" id="btn3" value="选中所有奇数">
 6 <input type="button" id="btn6" value="选中所有偶数">
 7 <input type="button" id="btn4" value="反选">
 8 <input type="button" id="btn5" value="获得选中的所有值">
 9 <br>
10 <input type="checkbox" name="checkbox" value="checkbox1">
11 checkbox1
12 <input type="checkbox" name="checkbox" value="checkbox2">
13 checkbox2
14 <input type="checkbox" name="checkbox" value="checkbox3">
15 checkbox3
16 <input type="checkbox" name="checkbox" value="checkbox4">
17 checkbox4
18 <input type="checkbox" name="checkbox" value="checkbox5">
19 checkbox5
20 <input type="checkbox" name="checkbox" value="checkbox6">
21 checkbox6
22 <input type="checkbox" name="checkbox" value="checkbox7">
23 checkbox7
24 <input type="checkbox" name="checkbox" value="checkbox8">
25 checkbox8
26 </div>
27 </form>