jQuery全选反选

chanshui

浏览: 82918 次
性别:
来自: 上海

最近访客更多访客>>

jerrt

cshuig

yangleicba

guangshan1992

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

jQuery HTML

1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2<HTML>
 3 <HEAD>
 4  <TITLE> New Document </TITLE>
 5  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 6  <link href="css/ingrid.css" rel="stylesheet" type="text/css">
 7<script language="JavaScript" src="jquery-1.2.3.pack.js" type="text/javascript"></script>
 8  <SCRIPT LANGUAGE="JavaScript">
 9  <!--
10      $("document").ready(function(){
11          
12       $("#btn1").click(function(){
13           
14          $("[name='checkbox']").attr("checked",'true');//全选
15        
16       })
17       $("#btn2").click(function(){
18           
19          $("[name='checkbox']").removeAttr("checked");//取消全选
20        
21       })
22       $("#btn3").click(function(){
23           
24          $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
25        
26       })
27       $("#btn4").click(function(){
28           
29          $("[name='checkbox']").each(function(){
30              
31            
32              if($(this).attr("checked"))
33            {
34                $(this).removeAttr("checked");
35                
36            }
37            else
38            {
39                $(this).attr("checked",'true');
40                
41            }
42            
43          })
44        
45       })
46        $("#btn5").click(function(){
47       var str="";
48          $("[name='checkbox'][checked]").each(function(){
49              str+=$(this).val()+"\r\n";
50          })
51         alert(str);
52       })
53      })
54  //-->
55  </SCRIPT>
56  
57 </HEAD>
58
59 <BODY>
60 <form name="form1" method="post" action="">
61   <input type="button" id="btn1" value="全选">
62   <input type="button" id="btn2" value="取消全选">
63   <input type="button" id="btn3" value="选中所有奇数">
64   <input type="button" id="btn4" value="反选">
65   <input type="button" id="btn5" value="获得选中的所有值">
66   <br>
67   <input type="checkbox" name="checkbox" value="checkbox1">
68   checkbox1
69   <input type="checkbox" name="checkbox" value="checkbox2">
70   checkbox2
71   <input type="checkbox" name="checkbox" value="checkbox3">
72   checkbox3
73   <input type="checkbox" name="checkbox" value="checkbox4">
74   checkbox4
75   <input type="checkbox" name="checkbox" value="checkbox5">
76   checkbox5
77   <input type="checkbox" name="checkbox" value="checkbox6">
78   checkbox6
79   <input type="checkbox" name="checkbox" value="checkbox7">
80   checkbox7
81   <input type="checkbox" name="checkbox" value="checkbox8">
82 checkbox8
83 </form>
84
85 </BODY>
86</HTML>

分享到：