`
sun201200204
  • 浏览: 294922 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

CheckBox单选

    博客分类:
  • j2ee
阅读更多
http://www.cnblogs.com/mextb1860/archive/2008/04/11/1147841.html


方法一
<BODY>   
 <input type="checkbox" name="cbox" value="cbox1" onClick="chooseOne(this);">checkBox1   
 <input type="checkbox" name="cbox" value="cbox2" onClick="chooseOne(this);">checkBox2   
 <input type="checkbox" name="cbox" value="cbox3" onClick="chooseOne(this);">checkBox3   
 <input type="checkbox" name="cbox" value="cbox4" onClick="chooseOne(this);">checkBox4   
 </BODY> 

 <script>   
     //chooseOne()函式,參數為觸發該函式的元素本身   
     function chooseOne(cb){   
         //先取得同name的chekcBox的集合物件   
         var obj = document.getElementsByName("cbox");   
         for (i=0; i<obj.length; i++){   
             //判斷obj集合中的i元素是否為cb,若否則表示未被點選   
             if (obj[i]!=cb) obj[i].checked = false;   
             //若是 但原先未被勾選 則變成勾選;反之 則變為未勾選   
             //else  obj[i].checked = cb.checked;   
             //若要至少勾選一個的話,則把上面那行else拿掉,換用下面那行   
             else obj[i].checked = true;   
         }   
     }   
 </script> 


方法二
<BODY>   
 <div id="mydiv">   
 <input type="checkbox" name="cbox1" value="cbox1" onClick="chooseOne(this);">checkBox1  
 <input type="checkbox" name="cbox2" value="cbox2" onClick="chooseOne(this);">checkBox2  
 <input type="checkbox" name="cbox3" value="cbox3" onClick="chooseOne(this);">checkBox3  
 <input type="checkbox" name="cbox4" value="cbox4" onClick="chooseOne(this);">checkBox4  
 </div>   
</BODY> 


 <script>   
     //chooseOne()函式,參數為觸發該函式的元素本身   
     function chooseOne(cb) {   
         //先取得Div元素   
         var obj = document.getElementById("mydiv");   
         ///判斷obj中的子元素i是否為cb,若否則表示未被點選   
         for (i=0; i<obj.children.length; i++){   
             if (obj.children[i]!=cb)    obj.children[i].checked = false;   
             //若是 但原先未被勾選 則變成勾選;反之 則變為未勾選   
             else    obj.children[i].checked = cb.checked;   
             //若要至少勾選一個的話,則把上面那行else拿掉,換用下面那行   
             //else obj.children[i].checked = true;   
         }   
     }   
 </script> 
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics