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 dialog键盘事件代码
Aug 01 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
Mar 18 Javascript
跟我学习javascript的call(),apply(),bind()与回调
Nov 16 Javascript
详解javascript跨浏览器事件处理程序
Mar 27 Javascript
深入理解js promise chain
May 05 Javascript
jQuery实现的超链接提示效果示例【附demo源码下载】
Sep 09 Javascript
JS触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
Oct 30 Javascript
JS原型与原型链的深入理解
Feb 15 Javascript
webstorm和.vue中es6语法报错的解决方法
May 08 Javascript
Angular8引入百度Echarts进行图表分析的实现代码
Nov 27 Javascript
微信浏览器下拉黑边解决方案 wScroollFix
Jan 21 Javascript
JavaScript实现简单贪吃蛇效果
Mar 09 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
PHPExcel简单读取excel文件示例
2016/05/26 PHP
Laravel日志用法详解
2016/10/09 PHP
php生出随机字符串
2017/07/06 PHP
Laravel5.* 打印出执行的sql语句的方法
2017/07/24 PHP
JavaScript窗口功能指南之在窗口中书写内容
2006/07/21 Javascript
js利用与或运算符优先级实现if else条件判断表达式
2010/04/15 Javascript
nodejs win7下安装方法
2012/05/24 NodeJs
angular $watch 一个变量的变化(实例讲解)
2017/08/02 Javascript
vue组件中的数据传递方法
2018/05/14 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
2019/06/21 Javascript
layui 解决富文本框form表单提交为空的问题
2019/10/26 Javascript
Vue+Element-U实现分页显示效果
2020/11/15 Javascript
详解Python核心编程中的浅拷贝与深拷贝
2018/01/07 Python
Python实现查看系统启动项功能示例
2018/05/10 Python
python numpy数组的索引和切片的操作方法
2018/10/20 Python
python模拟键盘输入 切换键盘布局过程解析
2019/08/15 Python
原生python实现knn分类算法
2019/10/24 Python
Django QuerySet查询集原理及代码实例
2020/06/13 Python
使用Keras训练好的.h5模型来测试一个实例
2020/07/06 Python
详解KMP算法以及python如何实现
2020/09/18 Python
python re的findall和finditer的区别详解
2020/11/15 Python
input file上传文件样式支持html5的浏览器解决方案
2012/11/14 HTML / CSS
研究生自荐信
2013/10/09 职场文书
信息工程学院毕业生推荐信
2013/11/05 职场文书
连锁酒店店长职责范本
2014/02/13 职场文书
金融事务专业求职信
2014/04/25 职场文书
青春奉献演讲稿
2014/05/08 职场文书
捐助感谢信
2015/01/22 职场文书
PHP 技巧 * SVG 保存为图片(分享图生成)
2021/04/02 PHP
Mysql文件存储图文详解
2021/06/01 MySQL
关于python中readlines函数的参数hint的相关知识总结
2021/06/24 Python
关于CSS浮动与取消浮动的问题
2021/06/28 HTML / CSS
Java集成swagger文档组件
2021/06/28 Java/Android
基于Go语言构建RESTful API服务
2021/07/25 Golang
SQL实现LeetCode(180.连续的数字)
2021/08/04 MySQL
Win11怎么把合并的任务栏分开 Win11任务栏合并分开教程
2022/04/06 数码科技