经常会遇到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. React 属性和状态具体解释

    属性的含义和使用方法 props=properties 属性:一个事物的性质与关系 属性往往是与生俱来的.无法自己改变的. 属性的使用方法: 第一种方法:键值对 1.传入一个字符串:"Hi& ...

  2. linux(ubuntu) 查看系统设备信息

    ubuntu查看版本命令 方法一: 在终端中执行下列指令: cat /etc/issue 方法二: 使用 lsb_release 命令也可以查看 Ubuntu 的版本号,与方法一相比,内容更为详细. ...

  3. IOS+openCV在Xcode的入门开发(转)

    看这篇文章之前先看看这个地址:OpenCV iOS开发(一)——安装 昨天折腾了一天,终于搞定了openCV+IOS在Xcode下的环境并且实现一个基于霍夫算法的圆形识别程序.废话不多说,下面就是具体 ...

  4. PHP权限控制(转)

    PHP: 我这里说到的权限管理办法是一个普遍采用的方法,主要是使用到"位运行符"操作,& 位与运算符.| 位或运行符.参与运算的如果是10进制数,则会被转换至2进制数参与运 ...

  5. Axure 蚂蚁设计团队组件库 让交互稿美美"搭"

    Github资源:https://github.com/ant-design/ant-design-pro English | 简体中文 技术实践篇 https://pro.ant.design/do ...

  6. android中文字中间有超链接的实现方法

      1.XML里写: <resources> <string name="ACCOUNT_REGISTER_PROMPT_AGREEMENT">点击注册,表 ...

  7. sed正则

    sed -i 's/[A-Za-z0-9]*\.sdongpo\.com/group110.sdongpo.com/g' test.js

  8. SQL 关于apply的两种形式cross apply 和 outer apply, with cube 、with rollup 和 grouping

    1). apply有两种形式: cross apply 和 outer apply先看看语法: <left_table_expression> {cross|outer} apply &l ...

  9. Centos7 通过yum源安装nginx

    通过rpm 添加yum源 rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ng ...

  10. 老生常谈combobox和combotree模糊查询

    FIRST /** * combobox和combotree模糊查询 * combotree 结果显示两级父节点(手动设置数量) * 键盘上下键选择叶子节点 * 键盘回车键设置文本的值 */ (fun ...