1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="textml; charset=utf-8"> 5 <title></title> 6 <script type="text/javascript"> 7 /* 8 * 步骤： 9 * 1.新建一个空数组 10 * 2.获取name为“check”的多选款 11 * 3.循环判断多选框是否被选中，如果被选中则添加到数组里 12 * 4.获取输出按钮，然后为按钮添加onclick事件，输出数组的长度 13 * */ 14 window.onload = function () { 15 //获取ID为btn的元素 16 var btn = document.getElementById("btn"); 17 //给元素添加onclick事件 18 btn.onclick = function () { 19 //新建一个空数组 20 var arrays = new Array(); 21 //获取name为check的一组元素 22 var items = document.getElementsByName("check"); 23 //循环这组数组 24 for (i = 0; i < items.length; i++) { 25 //判断是否选中 26 if (items[i].checked) { 27 //把符合条件的数组添加到数组中 28 arrays.push(items[i].value); 29 } 30 } 31 alert("选中的个数为：" + arrays.length); 32 } 33 } 34 </script> 35 </head> 36 <body> 37 <form method="post" action="#"> 38 <input type="checkbox" value="1" name="check" checked="checked"/> 39 <input type="checkbox" value="2" name="check"/> 40 <input type="checkbox" value="3" name="check" checked="checked"/> 41 <input type="button" value="你选中的个数" id="btn"/> 42 </form> 43 </body> 44 </html>