- <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <htmlxmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title></title>
- <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
- <scripttype="text/javascript">
- window.οnlοad=function(){//页面所有元素加载完毕
- varbtn=document.getElementById("btn");//获取id为btn的元素(button)
- btn.οnclick=function(){//给元素添加onclick事件
- vararrays=newArray();//创建一个数组对象
- varitems=document.getElementsByName("check");//获取name为check的一组元素(checkbox)
- for(i=0;i<items.length;i++){//循环这组数据
- if(items[i].checked){//判断是否选中
- arrays.push(items[i].value);//把符合条件的添加到数组中.push()是javascript数组中的方法.
- }
- }
- alert("选中的个数为:"+arrays.length);
- }
- }
- </script>
- </head>
- <body>
- <formmethod="post"action="#">
- <inputtype="checkbox"value="1"name="check"checked="checked"/>
- <inputtype="checkbox"value="2"name="check"/>
- <inputtype="checkbox"value="3"name="check"checked="checked"/>
- <inputtype="button"value="你选中的个数"id="btn"/>
- </form>
- </body>
- </html>
//这样也算是实现了 表现层和行为层分离的效果。