JQuery radio(单选按钮)操作方法汇总


Posted in Javascript onApril 15, 2015

随着Jquery的作用越来越大,使用的朋友也越来越多。在Web中,由于CheckBox、Radiobutton 、DropDownList等控件使用的频率比较高,就关系到这些控件在Jquery中的操作问题。由于Jquery的版本更新很快,代码的写法也改变了许多,以下Jquery代码适query1.4版本以上。

JQuery radio(单选按钮)操作方法汇总

1.获取选中值,三种方法都可以:

$('input:radio:checked').val();

$("input[type='radio']:checked").val();

$("input[name='rd']:checked").val();

2.设置第一个Radio为选中值:
    $('input:radio:first').attr('checked', 'checked');

或者
$('input:radio:first').attr('checked', 'true');

注:attr("checked",'checked')= attr("checked", 'true')= attr("checked", true)

3.设置最后一个Radio为选中值:

$('input:radio:last').attr('checked', 'checked');

或者
$('input:radio:last').attr('checked', 'true');

4.根据索引值设置任意一个radio为选中值:
$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2....

或者
$('input:radio').slice(1,2).attr('checked', 'true');

5.根据Value值设置Radio为选中值
$("input:radio[value='rd2']").attr('checked','true');

或者
$("input[value='rd2']").attr('checked','true');

6.删除Value值为rd2的Radio
$("input:radio[value='rd2']").remove();

7.删除第几个Radio
$("input:radio").eq(索引值).remove();索引值=0,1,2....

如删除第3个Radio:$("input:radio").eq(2).remove();

8.遍历Radio

$('input:radio').each(function(index,domEle){
     //写入代码
});
Javascript 相关文章推荐
javascript setTimeout和setInterval计时的区别详解
Jun 21 Javascript
jquery必须知道的一些常用特效方法及使用示例(整理)
Jun 24 Javascript
用JavaScript计算在UTF-8下存储字符串占用字节数
Aug 08 Javascript
jquery.post用法示例代码
Jan 03 Javascript
jquery ajax请求方式与提示用户正在处理请稍等
Sep 01 Javascript
使用javascript实现简单的选项卡切换
Jan 09 Javascript
BootStrap智能表单实战系列(九)表单图片上传的支持
Jun 13 Javascript
完美实现八种js焦点轮播图(上篇)
Jul 18 Javascript
jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法
Aug 06 Javascript
JavaScript实现三级联动菜单效果
Aug 16 Javascript
监控微信小程序中的慢HTTP请求过程详解
Jul 05 Javascript
vue实现计算器功能
Feb 22 Javascript
JavaScript判断前缀、后缀是否是空格的方法
Apr 15 #Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 #Javascript
jquery插件star-rating.js实现星级评分特效
Apr 15 #Javascript
JQuery判断radio(单选框)是否选中和获取选中值方法总结
Apr 15 #Javascript
jQuery实现首页顶部可伸缩广告特效代码
Apr 15 #Javascript
JavaScript实现网页对象拖放功能的方法
Apr 15 #Javascript
Jquery判断radio、selelct、checkbox是否选中及获取选中值方法总结
Apr 15 #Javascript
You might like
我的论坛源代码(十)
2006/10/09 PHP
php 目录与文件处理-郑阿奇(续)
2011/07/04 PHP
php中namespace use用法实例分析
2016/01/22 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
php爬取天猫和淘宝商品数据
2018/02/23 PHP
Javascript中的常见排序算法
2007/03/27 Javascript
用Javscript实现表单复选框的全选功能
2007/05/25 Javascript
javascript面向对象包装类Class封装类库剖析
2013/01/24 Javascript
jQuery中ajax的使用与缓存问题的解决方法
2013/12/19 Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
2014/01/09 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
2014/10/11 Javascript
js显示当前日期时间和星期几
2015/10/22 Javascript
基于Bootstrap实现Material Design风格表单插件 附源码下载
2016/04/18 Javascript
Websocket协议详解及简单实例代码
2016/12/12 Javascript
JavaScript 中调用 Kotlin 方法实例详解
2017/06/09 Javascript
JavaScript之json_动力节点Java学院整理
2017/06/29 Javascript
详解如何解决vue开发请求数据跨域的问题(基于浏览器的配置解决)
2018/11/12 Javascript
详解ES7 Decorator 入门解析
2019/02/18 Javascript
用VueJS写一个Chrome浏览器插件的实现方法
2019/02/27 Javascript
VUE兄弟组件传值操作实例分析
2019/10/26 Javascript
js实现简单的秒表
2020/01/16 Javascript
在Django的form中使用CSS进行设计的方法
2015/07/18 Python
Django原生sql也能使用Paginator分页的示例代码
2017/11/15 Python
Python3导入自定义模块的三种方法详解
2018/04/13 Python
python3实现随机数
2018/06/25 Python
python openpyxl使用方法详解
2019/07/18 Python
python flask几分钟实现web服务的例子
2019/07/26 Python
使用Pandas将inf, nan转化成特定的值
2019/12/19 Python
python模拟哔哩哔哩滑块登入验证的实现
2020/04/24 Python
python 读取二进制 显示图片案例
2020/04/24 Python
HTML5几个设计和修改的页面范例分享
2015/09/29 HTML / CSS
导游的职业规划书范文
2013/12/27 职场文书
教学实验楼管理制度
2014/02/01 职场文书
竞选班长自荐书范文
2014/03/09 职场文书
读书月活动方案
2014/05/22 职场文书
校园广播稿精选
2014/10/01 职场文书