判断checkbox选择的个数多浏览器

就是不能让用户选择超过5个checkbox
<！DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <script language="JavaScript"></script> </head> <body> <table cellspacing="0" border="1" width="200" > <tr> <td><input type="checkbox" name="c"></td> <td><input type="checkbox" name="c"></td> <td><input type="checkbox" name="c"></td> </tr> <tr> <td><input type="checkbox" name="c"></td> <td><input type="checkbox" name="c"></td> <td><input type="checkbox" name="c"></td> </tr> </body> </html>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
第二种方法
<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script> function boxnum（obj）{} function checknum（）{ var e,srcE e=window.event？window.event:e;srcE=e.srcElement？e.srcElement:e.target;if（！srcE）return;if（String（srcE.tagName）.toLowerCase（）！="input"||String（srcE.type）.toLowerCase（）！="checkbox"）return; var box = document.form1.elements["checkbox3"]; var ii = 0 for（var i=0;i<box.length;i++）{ if（box[i].checked）{ii++;} } if（ii>5）{ alert（"最多不能超多5个主营项目！请重新选择！"）; srcE.checked=false; } } document.onkeydown=document.onchange=document.onclick=checknum;</script> </head> <body> <form id="form1" name="form1" method="post" action=""> <table width="520" height="221" border="1"> <tr> <td><label> <input type="checkbox" name="checkbox3" value="checkboxa" />1<input type="checkbox" name="checkbox3" value="checkboxaa" />2 <input type="checkbox" name="checkbox3" value="checkboxaaa" /> 3 <input type="checkbox" name="checkbox3" value="checkboxaaaa" /> 4 <input type="checkbox" name="checkbox3" value="checkboxcv" /> 5 <input type="checkbox" name="checkbox3" value="checkboxcvb" /> 6 <input type="checkbox" name="checkbox3" value="checkboxcvbcvb" /> 7 <input type="checkbox" name="checkbox3" value="checkboxcvbcvbcv" /> 8 <input type="checkbox" name="checkbox3" value="checcvb" /> 9 <input type="checkbox" name="checkbox3" value="checvb" /> 10 <input type="checkbox" name="checkbox3" value="chcvbox" /> <input type="checkbox" name="checkbox3" value="chcvbcvbox" /> <input type="checkbox" name="checkbox3" value="ccvbcvbcvox" /> </label></td> <td> </td> <td> </td> </tr> <tr> <td><input type="button" name="Submit" value="按钮" onclick="boxnum（"checkbox3"）" /></td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table> </form> </body> </html>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
上面的只能在IE下运行
支持多浏览器的方法
<form method="post" action="" name="form1" id="form1"> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> <input type="checkbox" name="a" /> </form> <script language="javascript" type="text/javascript"> var m_count = 0; document.getElementById（"form1"）.onclick = function（e）{ ele = （document.all）？window.event.srcElement:e.target; if （ele.nodeName.toLowerCase（）=="input" && ele.type.toLowerCase（）=="checkbox" && ele.checked） m_count++; if （ele.nodeName.toLowerCase（）=="input" && ele.type.toLowerCase（）=="checkbox" && ！ele.checked） m_count--; if（m_count>5）{ m_count--; alert（"最多不能超多5个主营项目！"）; return false; } return true; } </script>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

首页 / 脚本样式 / JavaScript / 判断checkbox选择的个数 多浏览器

首页 / 脚本样式 / JavaScript / 判断checkbox选择的个数多浏览器