如何使用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 相关文章推荐
Jquery AJAX 用于计算点击率(统计)
Jun 30 Javascript
基于jquery的时间段实现代码
Aug 02 Javascript
js实现单行文本向上滚动效果实例代码
Nov 28 Javascript
给应用部分的js代码设定一个统一的入口
Jun 15 Javascript
深入理解jQuery之事件移除
Jun 02 Javascript
JS获取当前页面名称的简单实例
Aug 19 Javascript
js实现多行文本框统计剩余字数功能
Mar 28 Javascript
Vue.js学习记录之在元素与template中使用v-if指令实例
Jun 27 Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
Aug 04 Javascript
微信小程序canvas实现刮刮乐效果
Jul 09 Javascript
vue自定义表单生成器form-create使用详解
Jul 19 Javascript
vue ref如何获取子组件属性值
Mar 31 Vue.js
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
杏林同学录(七)
2006/10/09 PHP
php邮件发送,php发送邮件的类
2011/03/24 PHP
如何使用php实现评委评分器
2015/07/31 PHP
详解PHP的Laravel框架中Eloquent对象关系映射使用
2016/02/26 PHP
Zend Framework教程之Zend_Form组件实现表单提交并显示错误提示的方法
2016/03/21 PHP
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
讨论html与javascript在浏览器中的加载顺序问题
2013/11/27 Javascript
input输入框鼠标焦点提示信息
2015/03/17 Javascript
JavaScript将数组转换成CSV格式的方法
2015/03/19 Javascript
ionic js 复选框 与普通的 HTML 复选框到底有没区别
2016/06/06 Javascript
使用Node.js实现RESTful API的示例
2017/08/01 Javascript
vue中的使用token的方法示例
2020/03/10 Javascript
解决vue props传Array/Object类型值,子组件报错的情况
2020/11/07 Javascript
一篇超完整的Vue新手入门指导教程
2020/11/18 Vue.js
python通过smpt发送邮件的方法
2015/04/30 Python
Python生成随机数组的方法小结
2017/04/15 Python
Python 模拟购物车的实例讲解
2017/09/11 Python
用python实现的线程池实例代码
2018/01/06 Python
python实现冒泡排序算法的两种方法
2018/03/10 Python
python实现键盘控制鼠标移动
2020/11/27 Python
Python3 串口接收与发送16进制数据包的实例
2019/06/12 Python
python读取ini配置的类封装代码实例
2020/01/08 Python
python实现图片横向和纵向拼接
2020/03/05 Python
浅谈Python3多线程之间的执行顺序问题
2020/05/02 Python
Python使用Numpy模块读取文件并绘制图片
2020/05/13 Python
Python 3.9的到来到底是意味着什么
2020/10/14 Python
Python高阶函数与装饰器函数的深入讲解
2020/11/10 Python
详解Python中如何将数据存储为json格式的文件
2020/11/18 Python
python 制作网站筛选工具(附源码)
2021/01/21 Python
澳大利亚首屈一指的鞋类品牌:Tony Bianco
2018/03/13 全球购物
请编写一个 C 函数,该函数在给定的内存区域搜索给定的字符,并返回该字符所在位置索引值
2014/09/15 面试题
外企财务年会演讲稿
2014/01/03 职场文书
战友聚会策划方案
2014/06/13 职场文书
小学生我的梦想演讲稿
2014/08/21 职场文书
2014年国庆节活动总结
2014/08/26 职场文书
vue使用wavesurfer.js解决音频可视化播放问题
2022/04/04 Vue.js