三种取消选中ra
dio的方式,本文依赖于jQuery,其中第一种,第二种方式是使用jQuery实现的,第三种方式是基于JS和DOM实现的。
<script type=text/javascript src=http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js> </script>
<script type=text/javascript>
/**
* 三种取消选中radio的方式
*
* @param
* @arrange (编程之家) jb51.cc
**/
$(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>
经测试
代码如下:
<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>