本文提供了三種取消選中radio的方式，代碼示例如下:
本文依賴于jQuery,其中第一種，第二種方式是使用jQuery實現的，第三種方式是基于JS和DOM實現的。
<!DOCTYPE HTML> <html> <head> <title>單選按鈕取消選中的三種方式</title> <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"> </script> <script type="text/javascript"> $(function(){ // var $browsers = $("input[name=browser]"); var $cancel = $("#cancel"); var $byhide = $("#byhide"); var $remove = $("#remove"); // $cancel.click(function(e){ // 移除屬性,兩種方式都可 //$browsers.removeAttr("checked"); $browsers.attr("checked",false); }); // $byhide.click(function(e){ // 切換到一個隱藏域,兩種方式均可 //$("#hidebrowser").attr("checked",true); $("#hidebrowser").attr("checked","checked"); }); // $remove.click(function(e){ // 直接去的DOM元素,移除屬性 // 如果不使用jQuery,則可以移植此方式 var checkedbrowser=document.getElementsByName("browser"); /* $.each(checkedbrowser, function(i,v){ v.checked = false; v.removeAttribute("checked"); }); */ // var len = checkedbrowser.length; var i = 0; for(; i < len; i++){ // 必須先賦值為false,再移除屬性 checkedbrowser[i].checked = false; // 不移除屬性也可以 //checkedbrowser[i].removeAttribute("checked"); } }); }); </script> </head> <body> <p>您喜歡哪款瀏覽器？</p> <form> <input style="display:none;" id="hidebrowser" type="radio" name="browser" value=""> <input type="radio" name="browser" value="Internet Explorer">Internet Explorer<br /> <input type="radio" name="browser" value="Firefox">Firefox<br /> <input type="radio" name="browser" value="Netscape">Netscape<br /> <input type="radio" name="browser" value="Opera">Opera<br /> <br /> <input type="button" id="cancel" value="取消選中方式1" size="20"> <input type="button" id="byhide" value="取消選中方式2" size="20"> <input type="button" id="remove" value="取消選中方式3" size="20"> </form> </body> </html>新聞熱點
疑難解答
