如何使用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 相关文章推荐
用js查找法实现当前栏目的高亮显示的代码
Nov 24 Javascript
ExtJS 2.0实用简明教程之应用ExtJS
Apr 29 Javascript
js实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
May 27 Javascript
jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
Jul 27 Javascript
HTML5 canvas 9绘制图片实例详解
Sep 06 Javascript
详解angularJs中关于ng-class的三种使用方式说明
Jun 02 Javascript
使用puppeteer破解极验的滑动验证码
Feb 24 Javascript
JS实现图片旋转动画效果封装与使用示例
Jul 09 Javascript
vue 右键菜单插件 简单、可扩展、样式自定义的右键菜单
Nov 29 Javascript
Makefile/cmake/node-gyp中区分判断不同平台的方法
Dec 18 Javascript
javascript实现fetch请求返回的统一拦截
Dec 22 Javascript
原生js实现日期选择插件
May 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
虹吸式咖啡壶操作
2021/03/03 冲泡冲煮
PHP+DBM的同学录程序(4)
2006/10/09 PHP
windows server 2008/2012安装php iis7 mysql环境搭建教程
2016/06/30 PHP
php获取excel文件数据
2017/04/21 PHP
用JQuery 实现AJAX加载XML并解析的脚本
2009/07/25 Javascript
JQuery实现绚丽的横向下拉菜单
2013/12/19 Javascript
jQuery实现动画效果的简单实例
2014/01/27 Javascript
jQuery实现自动滚动到页面顶端的方法
2015/05/22 Javascript
jQuery组件easyui基本布局实现代码
2016/08/25 Javascript
jQuery实现微信长按识别二维码功能
2016/08/26 Javascript
微信小程序 条件渲染详解
2016/10/09 Javascript
easyUI实现类似搜索框关键词自动提示功能示例代码
2016/12/27 Javascript
NodeJS学习笔记之Module的简介
2017/03/24 NodeJs
vue解决跨域路由冲突问题思路解析
2017/11/03 Javascript
Koa2 之文件上传下载的示例代码
2018/03/29 Javascript
在Vue methods中调用filters里的过滤器实例
2018/08/30 Javascript
Vue 使用formData方式向后台发送数据的实现
2019/04/14 Javascript
jquery实现下载图片功能
2019/07/18 jQuery
JointJS JavaScript流程图绘制框架解析
2019/08/15 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
2020/01/20 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
2020/06/12 Javascript
Python使用minidom读写xml的方法
2015/06/03 Python
python xml.etree.ElementTree遍历xml所有节点实例详解
2016/12/04 Python
Python使用zip合并相邻列表项的方法示例
2018/03/17 Python
pytorch 改变tensor尺寸的实现
2020/01/03 Python
在Python中使用K-Means聚类和PCA主成分分析进行图像压缩
2020/04/10 Python
香港化妆品经销商:我的公主
2016/08/05 全球购物
教师实习期自我鉴定
2013/10/06 职场文书
大学生先进事迹材料
2014/02/16 职场文书
《珍珠泉》教学反思
2014/02/20 职场文书
就职演讲稿范文
2014/05/19 职场文书
安全生产标语大全
2014/10/06 职场文书
六一晚会主持词开场白
2015/05/28 职场文书
2016年植树节红领巾广播稿
2015/12/17 职场文书
2019年XX公司的晨会制度及流程!
2019/07/23 职场文书
SQL Server作业失败:无法确定所有者是否有服务器访问权限的解决方法
2021/06/30 SQL Server