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

作者: 铁锚

日期: 2013年12月21日

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

转载于:https://www.cnblogs.com/lanzhi/p/6467057.html

取消选中单选框radio的三种方式相关推荐

php单选框点击取消,取消选中单选框radio的三种方式
本文提供了三种取消选中radio的方式,代码示例如下: 本文依赖于jQuery,其中第一种,第二种方式是使用jQuery实现的,第三种方式是基于JS和DOM实现的. HTML> 单选按钮取消选中 ...
vue单选框选中_使用vue如何默认选中单选框
使用了vue以后,发现这真的是一个灵活高效的框架,能够轻松实现页面的实时刷新. 那么,今天先聊聊单选框的使用.一般我们使用单选框,会这么写: //HTML one two three 有"c ...
前端radio单选框默认选中_「radio选中」单选框radio总结（获取值、设置默认选中值、样式） - seo实验室...
radio选中单选框 radio 是否 1.获取值 $("input[name='killOrder']:checked").val(); $('input:radio:che ...
js原生、jquery单选框radio总结（获取值、设置默认选中值、样式）
单选框 radio总结: 一.页面样式截图: <div class="radio-inline"><input type="radio" na ...
jquery单选框radio绑定click事件实现和是否选中的方法
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...
页面初始化设置单选框radio默认选中，清空默认选中
前言: 页面初始化设置单选框radio默认选中,根据公司已有的标签属性来写的,坑,刚开始一直获取不到这个圆框框,搞了半天,终于搞定了. 浏览器截图: js代码: 产品的name是由uuid生成的: $ ...
antd radio设置默认选中_单选框radio总结（获取值、设置默认选中值、样式）
单选框 radio 是否 1.获取值 $("input[name='killOrder']:checked").val(); $('input:radio:checked').v ...
layui 单选框radio 监控事件
1,图示 2,需求说明: 当我选中单选框时,会触发事件,当我取消单选框时,也会触发事件注意:仅限表单使用 3,代码 <div class="layui-input-block&quo ...
设置word只读模式的三种方式，分别如何取消只读模式？
word文件可以设置只读模式,但是设置只读模式的方法不止有一种,今天和大家分享三种方式: 方式一: 这种只读模式仅起到提示功能,只是在打开文件时提示他人作者希望以只读方式打开,但是打开文件之后,我们还 ...

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

取消选中单选框radio的三种方式相关推荐

最新文章

热门文章