jQuery操作CheckBox的方法(选中,取消,取值)详解

分手后的思念是犯贱 2022-01-22 23:43 631阅读 0赞

1.  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"**>**     
2.  **<****HTML****>**     
3.   **<****HEAD****>**     
4.    **<****TITLE****>** New document．nbsp;**</****TITLE****>**     
5.    **<****meta** http-equiv="Content-Type" content="text/html; charset=UTF-8" **/>**     
6.      **<****SCRIPT** LANGUAGE="javascript" src="http://www.cnjquery.com/demo/jquery.js"**>****</****script****>**     
7.    **<****SCRIPT** LANGUAGE="javascript"**>**     
8.    <!--     
9.     $("document．quot;).ready(function()\{     
10.          
11.     $("\#btn1").click(function()\{     
12.           
13.     $("\[name='checkbox'\]").attr("checked",'true');//全选     
14.        
15.     \})     
16.        $("\#btn2").click(function()\{     
17.           
18.     $("\[name='checkbox'\]").removeAttr("checked");//取消全选     
19.        
20.     \})     
21.     $("\#btn3").click(function()\{     
22.           
23.     $("\[name='checkbox'\]:even").attr("checked",'true');//选中所有奇数     
24.        
25.     \})     
26.     $("\#btn4").click(function()\{     
27.           
28.     $("\[name='checkbox'\]").each(function()\{     
29.           
30.         
31.      if($(this).attr("checked"))     
32.    \{     
33.     $(this).removeAttr("checked");     
34.          
35.    \}     
36.    else    
37.    \{     
38.     $(this).attr("checked",'true');     
39.          
40.    \}     
41.         
42.     \})     
43.        
44.     \})     
45.      $("\#btn5").click(function()\{     
46.     var str="";     
47.     $("\[name='checkbox'\]\[checked\]").each(function()\{     
48.      str+=$(this).val()+""r"n";     
49.    //alert($(this).val());     
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****>**