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中的相等与不等运算
Apr 25 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
jquery教程限制文本框只能输入数字和小数点示例分享
Jan 13 Javascript
js加入收藏以及使用Jquery更改透明度
Jan 26 Javascript
动态显示可输入的字数提示还可以输入的字数
Apr 01 Javascript
Javascript排序算法之计数排序的实例
Apr 05 Javascript
window.location.href的用法(动态输出跳转)
Aug 09 Javascript
AngularJS实现元素显示和隐藏的几个案例
Dec 09 Javascript
Vue.js每天必学之数据双向绑定
Sep 05 Javascript
微信小程序显示下拉列表功能【附源码下载】
Dec 12 Javascript
微信小程序转化为uni-app项目的方法示例
May 22 Javascript
node中使用shell脚本的方法步骤
Mar 23 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
PHP ajax 分页类代码
2008/11/13 PHP
深入解析yii权限分级式访问控制的实现(非RBAC法)
2013/06/13 PHP
PHP钩子实现方法解析
2019/05/21 PHP
JQuery为textarea添加maxlength属性的代码
2010/04/07 Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
2012/09/14 Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
2013/03/18 Javascript
js获取url参数值的两种方式
2013/09/10 Javascript
基于jQuery对象和DOM对象和字符串之间的转化实例
2017/08/08 jQuery
解决jquery appaend元素中id绑定事件失效的问题
2017/09/12 jQuery
详解 vue better-scroll滚动插件排坑
2018/02/08 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
2018/03/03 Javascript
JS实现的简单折叠展开动画效果示例
2018/04/28 Javascript
js input输入百分号保存数据库失败的解决方法
2018/05/26 Javascript
微信小程序 自定义复选框实现代码实例
2019/09/04 Javascript
Openlayers学习之地图比例尺控件
2020/09/28 Javascript
[49:35]KG vs SECRET 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
python创建只读属性对象的方法(ReadOnlyObject)
2013/02/10 Python
Python写的创建文件夹自定义函数mkdir()
2014/08/25 Python
Python中的urllib模块使用详解
2015/07/07 Python
用python简单实现mysql数据同步到ElasticSearch的教程
2018/05/30 Python
Python反射和内置方法重写操作详解
2018/08/27 Python
Python中GeoJson和bokeh-1的使用讲解
2019/01/03 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
python批量处理文件或文件夹
2020/07/28 Python
Python猜数字算法题详解
2020/03/01 Python
英国领先品牌手动工具和电动工具供应商:Tooled Up
2018/11/24 全球购物
体育老师的教学自我评价分享
2013/11/19 职场文书
运动会开幕式主持词
2014/03/28 职场文书
公司周年庆典策划方案
2014/05/17 职场文书
学校读书活动总结
2014/06/30 职场文书
三好学生评语大全
2014/12/29 职场文书
圣诞节开幕词
2015/01/29 职场文书
教导处教学工作总结
2015/08/12 职场文书
大学自主招生自荐信(2016精选篇)
2016/01/28 职场文书
Win11开始菜单添加休眠选项
2022/04/19 数码科技
德生TECSUN S-2000使用手册文字版
2022/05/10 无线电