1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
2 <html>
3 <head>
4 <title>exe_1.html</title>
5 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
6 <script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
7 </head>
8 <body>
9 <input type="checkbox" value="蓝球"/>蓝球
10 <input type="checkbox" value="排球"/>排球
11 <input type="checkbox" value="羽毛球"/>羽毛球
12 <input type="checkbox" value="乒乓球"/>乒乓球
13 <input type="button" value="选中的个数"/>
14 <input type="button" value="依次显示选中的value"/>
15 <script type="text/javascript">
16 //对多选框进行操作
17 //1、选中的个数
18 $("input[value='选中的个数']").click(function(){
19 //alert("选中了");
20 //取得选中的个数
21 var size = $(":checked").size();
22 //alert(size);
23 });
24 //2、依次显示选中的value
25 $("input[value='依次显示选中的value']").click(function(){
26 //alert("依次显示选中的value");
27 //取得选中的checkbox的值
28 //var value = $("checked").val();
29 $(":checked").each(function(){
30 alert($(this).val());
31 });
32 });
33
34 /*或者：
35 $("input:button:eq(0)").click(function(){
36 window.alert($("input:checkbox:checked").size());
37 });
38 $("input:button:eq(1)").click(function(){
39 $("input:checkbox:checked").each(function(){
40 window.alert($(this).val());
41 });
42 });
43 */
44 </script>
45 </body>
46 </html>
by hacket