经常会遇到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. Java Source Attacher 1.2 发布

    Java Source Attacher 1.2 是一款自动帮你附加源代码的Eclipse插件,相信很多Java Coder都有过手动附加源代码的经历,去网上搜索,然后下载下来,最后附加上,很麻烦,而 ...

  2. mysql(表类型的选择)

    1.查询mysql所支持的存储引擎 第一种方法:show engines \G

  3. C#:数据库操作(待补充)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...

  4. 有道翻译 / 百度翻译Api

    比较推荐使用百度翻译api 不推荐有道翻译,比较水. http://ai.youdao.com/docs/doc-trans-api.s#p02 http://ai.youdao.com/docs/d ...

  5. 响应式布局框架 Pure-CSS 5.0 示例中文版-上

    0. Pure-CSS 介绍 Pure CSS 是雅虎出品的 CSS 框架, 依托于Normalize.CSS,在不适用任何JS代码情况下即可实现响应式布局的轻量级框架,无依赖,体积小. 1. CDN ...

  6. 编译器DIY——读文件

    编译器的前端词法分析:将源文件解析成一个个的单词流.为语法分析做准备. 在词法分析阶段,我们要做的就是将词分出来,而且确定单词的类型,一般的程序设计语言的单词符号能够份为下面5种: 1.keyword ...

  7. Building and running Node.js for Android

    转自: http://www.goland.org/nodejsonandroid/ Building and running Node.js for Android October 14, 2014 ...

  8. php7性能、兼容性和稳定性探讨

    前几天看到php7发布了beta1版本,想了解一下php7到底折腾了些啥东西出来.这一了解发现不得了了,改变还挺多的.最最重要的方面就是性能提升了不少,这边有一个pdf文件是惠新宸(鸟哥,php核心开 ...

  9. hdu3948(后缀数组)

    题意:给一串字符,需要你求不相同的回文子串个数....... 同ural1297,链接:http://www.cnblogs.com/ziyi--caolu/archive/2013/06/09/31 ...

  10. [C++]using std string;的作用是什么

    相关资料: http://bbs.csdn.net/topics/330194465 #include <string>将string库包含到当前编译单元中. using std::str ...