三种取消选中radio的方式，本文依赖于jQuery,其中第一种，第二种方式是使用jQuery实现的，第三种方式是基于JS和DOM实现的。

<!DOCTYPE HTML>

<html>

<head>

<title>单选按钮取消选中的三种方式_www.jbxue.com</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>

分享：三种取消选中单选框radio的方法的更多相关文章

  1. 取消选中单选框radio的三种方式

    作者: 铁锚 日期: 2013年12月21日 本文提供了三种取消选中radio的方式,代码示例如下: 本文依赖于jQuery,其中第一种,第二种方式是使用jQuery实现的,第三种方式是基于JS和DO ...

  2. 吾八哥学Selenium(三)：操作复选框checkbox/单选框radio的方法

    复选框checkbox和单选框radio是web网站里经常会使用到的两个控件,那么在web自动化测试的时候如何利用Selenium来操作这俩控件呢?今天我们就来简单入门练习一下! html测试页面代码 ...

  3. jquery单选框radio绑定click事件实现和是否选中的方法

    使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...

  4. 单选框radio总结（获取值、设置默认选中值、样式）

    单选框 radio <div class="radio-inline"> <input type="radio" name="kil ...

  5. jquery单选框radio绑定click事件实现方法

    本文实例讲述了jquery单选框radio绑定click事件实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码代码如下: <html><head><title ...

  6. 单选框radio改变事件详解（用的jquery的radio的change事件）

    单选框radio改变事件详解(用的jquery的radio的change事件) 一.总结 1.用的jquery的radio的change事件:当元素的值发生改变时,会发生 change 事件,radi ...

  7. JS实现单选按钮回显时页面效果出现，但选中单选框的值为空

    最近做了很多前端页面的工作,遇到的一个感觉很头疼的问题在这里记一下: 经常用JS回显单选框,但是明明从页面效果上来看,单选框已经被选中了,可是却不能触发单选框的change事件,取值的时候用某种方法取 ...

  8. MFC学习单选框Radio使用

    创建单选框Radio ,ID号IDC_RADIO_NAME 1.获取单选框内容 int RadioState = ((CButton *)GetDlgItem(IDC_RADIO_NAME))-> ...

  9. 自定义单选框radio样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. GoldenGate 12c + Oracle 12c Multitenant Container databases

    下面为GoldenGate 12c + Oracle 12c Multitenant Container databases例子 1.安装OGG 源 端OGG: C:\Oracle\product\1 ...

  2. 〖Linux〗Kubuntu文件管理器单例的设置（即：一个工作区只一个文件管理器）

    有没有一种,情况: 1. 程序A打开了文件管理器: 2. 程序B又打开了文件管理器: 导致开了两个文件管理器,太不舒服了: 搜索下 kubuntu dolphin single instance,果然 ...

  3. 【Linux】文件批量重命名

    例如:我们现在有如下文件列表 我们现在想要把.log..LOG与.rar为扩展名的文件全部重新命名,具体脚本如下: #!/bin/sh ##------------------------------ ...

  4. 【DB2】delete大表不记录日志的正确操作

    一.原始方法 在删除大表的时候,经常会由于数据量太大,造成日志文件满了,接着无法删除数据. 以下是删除大表不记录日志的具体步骤: 1.临时设置自动提交关闭 (使用命令db2 list command ...

  5. weblogic服务目录迁移记录

    weblogic服务,由于前期的规划不好,导致后期有点问题!为了更加规范运行服务及执行相关操作,故进行服务迁移... 先决条件:weblogic都是单个aminserver运行的,单个服务 问题解决: ...

  6. 播布客视频PIT专用播放器MBOO2015

    播布客视频,还是挺不错... 很多视频都是pit后缀的,需要用MBOO2015才可以打开... 00.MB2015软件 01.视频样例 02.download 链接: https://pan.baid ...

  7. H5类似易企秀/编辑器/页面制作/开发/生成工具/软件/源码/授权

    代码地址如下:http://www.demodashi.com/demo/14960.html 项目简介 H5DS (HTML5 Design software) 这是一款基于WEB的 H5制作工具. ...

  8. 【TP3.2】详解_initialize() 和 __construct() 的区别和联系

    1.假设 一个AdminController.class.php 集成至 \Think\Controller 类, 我们来看看Controller.class.php的构造方法源码: /** * 架构 ...

  9. java 下对字符串的格式化

    1.对整数进行格式化:%[index$][标识][最小宽度]转换方式         我们可以看到,格式化字符串由4部分组成,其中%[index$]的含义我们上面已经讲过,[最小宽度]的含义也很好理解 ...

  10. HDUOJ---老人是真饿了

    悼念512汶川大地震遇难同胞——老人是真饿了 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/O ...