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 相关文章推荐
基于JQuery的一个简单的鼠标跟随提示效果
Sep 23 Javascript
js 上下左右键控制焦点(示例代码)
Dec 14 Javascript
javascript 构造函数方式定义对象
Jan 02 Javascript
将form表单通过ajax实现无刷新提交的简单实例
Oct 12 Javascript
JavaScript实现简单生成随机颜色的方法
Sep 21 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
Jul 24 jQuery
JavaScript查看代码运行效率console.time()与console.timeEnd()用法
Jan 18 Javascript
JS实现的类似微信聊天效果示例
Jan 29 Javascript
Node.js API详解之 string_decoder用法实例分析
Apr 29 Javascript
微信小程序实现列表滚动头部吸顶的示例代码
Jul 12 Javascript
详解Webpack4多页应用打包方案
Jul 16 Javascript
基于Ionic3实现选项卡切换并重新加载echarts
Sep 24 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 特殊字符处理函数
2008/09/05 PHP
解析func_num_args与func_get_args函数的使用
2013/06/24 PHP
解析如何修改phpmyadmin中的默认登陆超时时间
2013/06/25 PHP
php使用Session和文件统计在线人数
2015/07/04 PHP
php实现Mysql简易操作类
2015/10/11 PHP
PHP编写daemon process详解及实例代码
2016/09/30 PHP
laravel 查询数据库获取结果实现判断是否为空
2019/10/24 PHP
php设计模式之观察者模式实例详解【星际争霸游戏案例】
2020/03/30 PHP
使用JQuery进行跨域请求
2010/01/25 Javascript
jquery向.ashx文件post中文乱码问题的解决方法
2011/03/28 Javascript
jquery中ajax函数执行顺序问题之如何设置同步
2014/02/28 Javascript
利用jQuery及AJAX技术定时更新GridView的某一列数据
2015/12/04 Javascript
jQuery实现的省市县三级联动菜单效果完整实例
2016/08/01 Javascript
详解promise.then,process.nextTick, setTimeout 以及 setImmediate的执行顺序
2018/11/21 Javascript
vue App.vue中的公共组件改变值触发其他组件或.vue页面监听
2019/05/31 Javascript
js实现消灭星星(web简易版)
2020/03/24 Javascript
Python enumerate遍历数组示例应用
2008/09/06 Python
python实现井字棋游戏
2020/03/30 Python
详解Django的CSRF认证实现
2018/10/09 Python
python 根据字典的键值进行排序的方法
2019/07/24 Python
与Django结合利用模型对上传图片预测的实例详解
2019/08/07 Python
Python发送邮件的实例代码讲解
2019/10/16 Python
解决python web项目意外关闭,但占用端口的问题
2019/12/17 Python
打印tensorflow恢复模型中所有变量与操作节点方式
2020/05/26 Python
基于pycharm 项目和项目文件命名规则的介绍
2021/01/15 Python
利用CSS3实现进度条的两种姿势详解
2017/03/21 HTML / CSS
CSS3 filter(滤镜)实现网页灰色或者黑色模式的示例代码
2021/02/24 HTML / CSS
HTML里显示pdf、word、xls、ppt的方法示例
2020/04/14 HTML / CSS
Mio Skincare中文官网:肌肤和身体护理
2016/10/26 全球购物
亚洲独特体验旅游专家:eOasia
2018/08/15 全球购物
六道php面试题附答案
2014/06/05 面试题
常务副总经理岗位职责
2014/04/12 职场文书
学前班评语大全
2014/05/04 职场文书
小学运动会演讲稿
2014/08/25 职场文书
避暑山庄导游词
2015/02/04 职场文书
千手观音观后感
2015/06/03 职场文书