如何使用Jquery获取Form表单中被选中的radio值


Posted in Javascript onAugust 09, 2013

Jquery提供的选择器极大的方便了开发人员对Dom的操作,真正实现了代码简化,却功能强大的目标。下面就日常最常用的,在Form表单中如何获取被中选的Radio值做一小小的示例。

form表单如下:

<form name='form1' action="#" method="post"> 此处略去200字 
<input type="radio" name="opType" value="0" />搁置<br /> 
<input type="radio" name="opType" value="1" />解决<br /> 
<input type="radio" name="opType" value="2" />转派4<br /> 
</form>

那么如何获取被选中的radio值呢,Juqery为我们提供了如下几个方法
$("input[name='opType']:checked").val() -------此方法估计用的比较多,通俗易懂 $("input:radio:checked").val(); ---------此方法最简单,但是连着使用选择器不容易懂 
$("input[@name='opType'][checked]"); --------次方法中切记写成[@checked=checked],本人第一次就写成这个了

那么,偶尔也需要遍历一下radio,如何做呢?当然需要each出场了,具体如下:
$('input[name="opType"]').each(function(){ 
alert(this.name+this.value); 
});

应该明白了吧,若有什么更好的方法欢迎盖楼。
Javascript 相关文章推荐
javascript 点击整页变灰的效果(可做退出效果)。
Jan 09 Javascript
Jquery 获得服务器控件值的方法小结
May 11 Javascript
javascript算法题 求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Jul 21 Javascript
extjs 04_grid 单击事件新发现
Nov 27 Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 Javascript
jQuery中next方法用法实例
Apr 24 Javascript
详解jQuery中的事件
Dec 14 Javascript
JS仿JQuery选择器功能
Mar 08 Javascript
js获取指定时间的前几秒
Apr 05 Javascript
vue实现点击关注后及时更新列表功能
Jun 26 Javascript
vue 属性拦截实现双向绑定的实例代码
Oct 24 Javascript
vue+springboot+element+vue-resource实现文件上传教程
Oct 21 Javascript
jquery对象和DOM对象的区别介绍
Aug 09 #Javascript
SOSO地图JS画出标注和中心点以html形式运行
Aug 09 #Javascript
javascript判断机器是否联网的2种方法
Aug 09 #Javascript
jquery 列表双向选择器之改进版
Aug 09 #Javascript
jquery 简单应用示例总结
Aug 09 #Javascript
JS命名空间的另一种实现
Aug 09 #Javascript
使用javascript创建快捷方式的简单实例
Aug 09 #Javascript
You might like
PHP开发中常用的8个小技巧
2008/08/27 PHP
php xml文件操作代码(一)
2009/03/20 PHP
PHP 抓取新浪读书频道的小说并生成txt电子书的代码
2009/12/18 PHP
新浪微博API开发简介之用户授权(PHP基础篇)
2011/09/25 PHP
PHP sprintf() 函数的应用(定义和用法)
2012/06/29 PHP
PHP实现多图片上传类实例
2014/07/26 PHP
什么情况下可以不写PHP的闭合标签“?&gt;”
2014/08/28 PHP
thinkPHP中钩子的使用方法实例分析
2017/11/16 PHP
PHP的mysqli_rollback()函数讲解
2019/01/23 PHP
传递参数的标准方法(jQuery.ajax)
2008/11/19 Javascript
jQuery最佳实践完整篇
2011/08/20 Javascript
jQuery源码分析-04 选择器-Sizzle-工作原理分析
2011/11/14 Javascript
JS解析XML实例分析
2015/01/30 Javascript
下一代Bootstrap的5个特点 超酷炫!
2016/06/17 Javascript
jQuery Easyui加载表格出错时在表格中间显示自定义的提示内容
2016/12/08 Javascript
vue 实现复制内容到粘贴板clipboard的方法
2018/03/17 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
2019/02/22 Javascript
Vue解析带html标签的字符串为dom的实例
2019/11/13 Javascript
如何手写简易的 Vue Router
2020/10/10 Javascript
深入理解Python中各种方法的运作原理
2015/06/15 Python
python实现线程池的方法
2015/06/30 Python
Python3.6.x中内置函数总结及讲解
2019/02/22 Python
python3实现高效的端口扫描
2019/08/31 Python
Python实现栈的方法详解【基于数组和单链表两种方法】
2020/02/22 Python
python实现人机五子棋
2020/03/25 Python
python脚本定时发送邮件
2020/12/22 Python
史泰博(Staples)中国官方网站:办公用品一站式采购
2016/09/05 全球购物
估算杭州有多少软件工程师
2015/08/11 面试题
大四自我鉴定范文
2013/10/06 职场文书
家长对孩子的感言
2014/03/10 职场文书
团日活动总结范文
2014/04/25 职场文书
旅游节目策划方案
2014/05/26 职场文书
企业承诺书格式范文
2015/04/28 职场文书
2015年初中教师个人工作总结
2015/07/21 职场文书
房地产置业顾问工作总结
2015/10/23 职场文书
个人房屋租赁合同(标准范本)
2019/09/16 职场文书