判斷覆選框中是否有被選中的代碼實例:覆選框中一般多項,有時候我們需要判斷這些付選中是否有被選中的項,下麵就通過一個實例簡單介紹一下如何實現此效果。代碼如下:限定覆選框的可選個數-螞蟻部落 螞蟻部落一 螞蟻部落二螞蟻部落三 螞蟻部落四螞蟻部落五 螞蟻部落六螞蟻部落七 螞蟻部落八螞蟻部落九 螞蟻部...
判斷覆選框中是否有被選中的代碼實例:
覆選框中一般多項,有時候我們需要判斷這些付選中是否有被選中的項,下麵就通過一個實例簡單介紹一下如何實現此效果。
代碼如下:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"/> <meta name="author" content="http://www.softwhy.com/" /> <title>限定覆選框的可選個數-螞蟻部落</title> </head> <script type="text/javascript"> function num() { var checboxs=document.getElementsByName("ck"); var len=checboxs.length; var arr=new Array(); for(var i=0;i<len;i++) { if(checboxs[i].checked) { arr.push(i+1); } } alert(arr); } window.onload=function() { var bt=document.getElementById("bt"); bt.onclick=num; } </script> <body > <div id="box"> <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落一 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落二 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落三 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落四 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落五 <p></p> <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落六 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落七 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落八 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落九 <label><input type="checkbox" name="ck" width="30px;"/></label>螞蟻部落十 </div> <input type="button" value="檢測選中哪幾項" id="bt" /> </body> </html>
以上代碼當點擊按鈕的時候,可以彈出被選中了哪幾個。代碼比較簡單這裡就不多介紹了,只簡單介紹一下原理:
通過getElementsByName()函數獲取checkbox對象集合,然後便利此集合,然後判斷每一項是否被選中,如果被選中就將此覆選框的順序存入數組,最後彈出,就這麼簡單。
相關閱讀:
1.getElementsByName()函數可以參閱javascript的document.getElementsByName()方法一章節。
2.checked可以參閱javascript的checkbox.checked屬性一章節。
3.push()函數可以參閱JavaScript的Array對象的push()方法一章節。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=8925
更多內容可以參閱:http://www.softwhy.com/javascript/