经常会遇到js控制radio选中和切换的问题

之前一直使用的是checked属性来完成的

但是现在发现这个属性有个大问题

今天就是用js给选中radio的赋值,使用的$().attr("checked",true);

当切换的时候,把name相同的radio的attr("checked",false),再把要选中的radio.attr("checked",true);

但是问题来了,每个radio只能被赋值一次,当第二次给他赋值的时候,赋不上值

后来发现,checkbox在这种情况下会出现一样的问题

于是仔细查了一下这个属性发现了问题

w3cshool上关于这个属性的介绍

可以看到,关键点在于被预先选定的input元素

也就是说这个属性原来就是打算页面加载的时候为了让radio有一个默认的值而增加的一个属性,这样有了这个属性的input在页面加载的时候就是选定的

所以当要切换input的时候,这个属性显然就不太合适了

所以在使用js对radio进行赋值切换的时候,推荐大家使用

1.$().prop("checked",true)

使用prop方法并搭配checked属性实现js点击radio

prop方法适用于set和get值为true/false的属性的方法如checked selected readyonly

而且不需要对未点击的radio做处理 很方便

2.$().click()

这个方法就比较干脆,直接出发点击事件,不会出现问题

这两个方法效果上一样

from:http://blog.csdn.net/u014267351/article/details/50333425

js控制radio选中的更多相关文章

  1. js控制select选中显示不同表单内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. JQuery控制radio选中和不选中方法总结

    一.设置选中方法 代码如下: $("input[name='名字']").get(0).checked=true; $("input[name='名字']"). ...

  3. jquery控制radio选中

    好久没写jquery了,昨天下午写一个效果,结果倒腾了半天还是没有解决,好在今天早上在网上询问到解决方法了,现在果断记录下. 要实现的效果就是交易方式选择时不同的交易方式下默认选中第一个选项. 如下: ...

  4. js设置radio选中

    在页面数据绑定时,经常会遇到给radio设置选中,以下是我写的js方法,经测试可以使用.欢迎拍砖 <html> <head> <script type="tex ...

  5. js jquery radio 选中 选中值

    radio示例: <label><input type="radio" name="type" id="type" val ...

  6. js控制单选按钮选中某一项

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

  7. js 控制radio选项

    <input type="radio" name="rk" value="aaa" />1<input type=&quo ...

  8. js取消radio选中 反选

    var radio=document.createElement("input");radio.type="radio";radio.onclick = fun ...

  9. js获取radio选中索引值

    <form name="form1" onsubmit="return foo()"> <input type="radio&quo ...

随机推荐

  1. 深入RecyclerView-为什么要使用ItemDecoration

    Part 1:不要用view做分割线 首先,什么是ItemDecoration?来看看官网是如何解释的. ItemDecoration允许从adapter的数据集合中为特定的item视图添加特性的绘制 ...

  2. 安装 percona-xtrabackup 2.4

    Installing Percona XtraBackup from Percona yum repository Install the Percona repository You can ins ...

  3. LaunchScreen.storyboard 设置图片后不显示(转)

    LaunchScreen.storyboard 设置图片后不显示 将图片放在根目录下即可 3D85E99F-A79B-4419-817D-1417E1446624.png   转至:http://ww ...

  4. 微信公众平台消息接口开发-封装weixin.class.php(转)

    一.封装weixin.class.php 由于微信公众平台的通信使用的是特定格式的XML数据,每次接受和回复都要去做一大堆的数据处理. 我们就考虑在这个基础上做一次封装,weixin.class.ph ...

  5. jQuery通过text值来设置选定,以及遍历select的选项个数和遍历

    真是醉了,网上搜了很久,全都是千篇一律的. 大家都拷贝来拷贝去,全是错的. 通过text值来设置select选定 $("#CompanyID").find("option ...

  6. Android 使用Post方式提交数据

    在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...

  7. 用Jedis操作redis示例一,Key,value HashMap

    简单的key,value形式 public class RedisDemo { public static void main(String[] args) { Jedis jedis = new J ...

  8. leetcode难度及频率

                    1 Two Sum 2 5 array sort           set Two Pointers   2 Add Two Numbers 3 4 linked l ...

  9. SQL Server2005 两台服务器上的数据库同步(转载)

    1.1测试环境 Item 发布机 A 订阅机 B OS Windows 2003 Server Windows 2003 Server SQL SQL Server 2005 企业版 SQL Serv ...

  10. hibernate中继承映射保存

    1 简单继承映射,在子类上进行映射配置,可以将父类属性直接配置在子类映射文件中. 简单例子如下:teacher类继承自Person类. public class Person { private in ...