如何使用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 相关文章推荐
为数据添加append,remove功能
Oct 03 Javascript
推荐dojo学习笔记
Mar 24 Javascript
入门基础学习 ExtJS笔记(一)
Nov 11 Javascript
IE6下出现JavaScript未结束的字符串常量错误的解决方法
Nov 21 Javascript
jQuery中使用data()方法读取HTML5自定义属性data-*实例
Apr 11 Javascript
jQuery 删除或是清空某个HTML元素示例
Aug 04 Javascript
jquery实现的蓝色二级导航条效果代码
Aug 24 Javascript
jQuery grep()方法详解及实例代码
Oct 30 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
Sep 28 Javascript
angular2模块和共享模块详解
Apr 08 Javascript
浅谈webpack4 图片处理汇总
Sep 12 Javascript
深入了解JavaScript 防抖和节流
Sep 12 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
构建简单的Webmail系统
2006/10/09 PHP
PHP开发中常用的8个小技巧
2008/08/27 PHP
一个PHP针对数字的加密解密类
2014/03/20 PHP
PHP 常用的header头部定义汇总
2015/06/19 PHP
PHP中的命名空间详细介绍
2015/07/02 PHP
PHP strcmp()和strcasecmp()的区别实例
2016/11/05 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
jquery中对表单的基本操作代码
2010/07/29 Javascript
如何判断元素是否为HTMLElement元素
2013/12/06 Javascript
Jquery中request和request.form和request.querystring的区别
2015/11/26 Javascript
表单input项使用label同时引用Bootstrap库导致input点击效果区增大问题
2016/10/11 Javascript
angularjs中的$eval方法详解
2017/04/24 Javascript
详解webpack解惑:require的五种用法
2017/06/09 Javascript
详解Nodejs之npm&amp;package.json
2017/06/15 NodeJs
AntV F2和vue-cli构建移动端可视化视图过程详解
2019/10/08 Javascript
如何利用node.js开发一个生成逐帧动画的小工具
2019/12/01 Javascript
vue实现分页的三种效果
2020/06/23 Javascript
[01:33:14]LGD vs VP Supermajor 败者组决赛 BO3 第二场 6.10
2018/07/04 DOTA
Python实现二分法算法实例
2015/02/02 Python
在Python中利用Into包整洁地进行数据迁移的教程
2015/03/30 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
python如何制作英文字典
2019/06/25 Python
python代码实现逻辑回归logistic原理
2019/08/07 Python
对Django中内置的User模型实例详解
2019/08/16 Python
opencv-python 读取图像并转换颜色空间实例
2019/12/09 Python
django rest framework serializer返回时间自动格式化方法
2020/03/31 Python
python 装饰器的使用示例
2020/10/10 Python
新法人代表任命书
2014/06/06 职场文书
最美护士演讲稿
2014/08/27 职场文书
刑事代理授权委托书
2014/09/17 职场文书
老兵退伍标语
2014/10/07 职场文书
先进教师个人事迹材料
2014/12/15 职场文书
先进个人事迹材料
2014/12/29 职场文书
无保留意见审计报告
2015/06/05 职场文书
长江七号观后感
2015/06/11 职场文书
北京青年观后感
2015/06/15 职场文书