手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >取消选中单选框radio的三种方式示例介绍
取消选中单选框radio的三种方式示例介绍
摘要:本文提供了三种取消选中radio的方式,代码示例如下:本文依赖于jQuery,其中第一种,第二种方式是使用jQuery实现的,第三种方式是基...

本文提供了三种取消选中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 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>

【取消选中单选框radio的三种方式示例介绍】相关文章:

JS对字符串编码的几种方式使用

JavaScript中的italics()方法的使用介绍

在ASP.NET MVC项目中使用RequireJS库的用法示例

AngularJS中处理多个promise的方式

JQuery勾选指定name的复选框集合并显示的方法

javascript消除window.close()的提示窗口

收集整理的四个方向的滚动

JavaScript数组去重的3种方法和代码实例

JS中字符串trim()使用示例

JavaScript中valueOf()方法的使用介绍

精品推荐
分类导航