checkbox显示选中内容个数

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>Insert title here</title>
 6     <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>
 7 </head>
 8 <body>
 9     <input type="checkbox" value="篮球" checked="checked">篮球</input>
10     <input type="checkbox" value="排球">排球</input>
11     <input type="checkbox" value="羽毛球" >羽毛球</input>
12     <input type="checkbox" value="乒乓球">乒乓球</input>
13     <input type="button" value="选中个数"></input>
14     <input type="button"  value="依次显示选中的value"></input>
15     
16     
17     <script type="text/javascript">
18             $(":button:first").click(function(){
19                 
20             alert($(":checkbox:checked").size());
21         });
22             $(":button:last").click(function(){
23                 $(":checkbox[checked='checked']").each(function(){
24                     alert($(this).val());
25                 });
26             
27         });
28     </script>
29 </body>
30 </html>