jQuery操作input type=radio的实现代码


Posted in Javascript onJune 14, 2012

<input type="radio">如下:

<input type="radio" name="city" value="BeiJing">北京 
<input type="radio" name="city" value="TianJin">天津 
<input type="radio" name="city" value="NanJing">南京 
<input type="radio" name="city" value="YangZhou">扬州 
<input type="radio" name="city" value="SuZhou">苏州

1、获取选中的radio的值:
$("input[name='city']:checked").val();

使用元素选择器,再使用属性过滤器name='city',最后使用:checked选取被选中的元素。

2、给指定值的radio设置选中状态:

$("input[name='city'][value='YangZhou']").attr("checked",true);

给name="city"而且value="YangZhou"的radio设置选中状态。

3、取消name="city"的radio的选中状态:

$('input[name="city"]:checked').attr("checked",false);

4、获取name="city"的radio的个数:

$("input[name='city']").length;

5、获取name="city"而且索引是偶数的radio:

$("input[name='city']:even");

索引是从0开始的。

6、获取name="city"而且索引是奇数的radio:

$("input[name='city']:odd");

索引是从0开始的。

7、迭代radio:

$("input[name='city']").each(function(i,obj){ 
//i,迭代的下标,从0开始 
//obj,当前的对象(HTMLInputElement),可以使用obj.value格式获取属性值 
//$(this);当前jQuery对象,可以使用$(this).val()获取属性值 
});

迭代name="city"的radio。

8、禁用radio:

$("input[name='city']").attr("disabled",true);

禁用name="city"的radio。

9、启用radio:

$("input[name='city']").attr("disabled",false);

启用name="city"的radio。

Javascript 相关文章推荐
百度 popup.js 完美修正版非常的不错 脚本之家推荐
Apr 17 Javascript
基于jquery的一个浮动框(扩展性比较好 )
Aug 27 Javascript
js中settimeout方法加参数
Feb 28 Javascript
jquery背景跟随鼠标滑动导航
Nov 20 Javascript
js中flexible.js实现淘宝弹性布局方案
Jun 23 Javascript
Node.js插件安装图文教程
May 06 Javascript
js与applet相互调用的方法
Jun 22 Javascript
鼠标经过出现气泡框的简单实例
Mar 17 Javascript
基于Node的React图片上传组件实现实例代码
May 10 Javascript
AngularJS下$http服务Post方法传递json参数的实例
Mar 29 Javascript
js+canvas实现画板功能
Sep 13 Javascript
原生JavaScript实现五子棋游戏
Nov 09 Javascript
jQuery操作 input type=checkbox的实现代码
Jun 14 #Javascript
基于jQuery的遍历同id元素 并响应事件的代码
Jun 14 #Javascript
jQuery操作select的实例代码
Jun 14 #Javascript
jQuery动态添加 input type=file的实现代码
Jun 14 #Javascript
jQuery 翻牌或百叶窗效果(内容三秒自动切换)
Jun 14 #Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
Jun 14 #Javascript
基于jQuery的360图片展示实现代码
Jun 14 #Javascript
You might like
自己动手做一个SQL解释器
2006/10/09 PHP
ThinkPHP模板之变量输出、自定义函数与判断语句用法
2014/11/01 PHP
PHP大文件分割上传 PHP分片上传
2017/08/28 PHP
javascript同步Import,同步调用外部js的方法
2008/07/08 Javascript
jQuery中与toggleClass等价的程序段 以及未来学习的方向
2010/03/18 Javascript
PHP 与 js的通信(via ajax,json)
2010/11/16 Javascript
jquery 页眉单行信息滚动显示实现思路及代码
2014/06/26 Javascript
Javascript检查图片大小不要让大图片撑破页面
2014/11/04 Javascript
JavaScript中的闭包介绍
2015/03/15 Javascript
Javascript实现的简单右键菜单类
2015/09/23 Javascript
JavaScript对象数组的排序处理方法
2015/10/21 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
2016/02/27 Javascript
jQuery获取同级元素的简单代码
2016/07/09 Javascript
实例解析angularjs的filter过滤器
2016/12/14 Javascript
[Bootstrap-插件使用]Jcrop+fileinput组合实现头像上传功能实例代码
2016/12/20 Javascript
JavaScript调试之console.log调试的一个小技巧分享
2017/08/07 Javascript
VueJs 搭建Axios接口请求工具
2017/11/20 Javascript
vue.js移动数组位置,同时更新视图的方法
2018/03/08 Javascript
JavaScript实现仿Clock ISO时钟
2018/06/29 Javascript
axios向后台传递数组作为参数的方法
2018/08/11 Javascript
vue里input根据value改变背景色的实例
2018/09/29 Javascript
解决vue admin element noCache设置无效的问题
2019/11/12 Javascript
基于python socketserver框架全面解析
2017/09/21 Python
python去除字符串中的换行符
2017/10/11 Python
python实现数独游戏 java简单实现数独游戏
2018/03/30 Python
python读取文件指定行内容实例讲解
2020/03/02 Python
Python读取文件内容为字符串的方法(多种方法详解)
2020/03/04 Python
利用python查看数组中的所有元素是否相同
2021/01/08 Python
大都会艺术博物馆商店:The Met Store
2018/06/22 全球购物
Miller Harris官网:英国小众香水品牌
2020/09/24 全球购物
理工科学生的自我评价
2013/12/15 职场文书
师德先进个人材料
2014/12/20 职场文书
2015政治思想表现评语
2015/03/25 职场文书
安全生产标语口号
2015/12/26 职场文书
JavaScript实现淘宝商品图切换效果
2021/04/29 Javascript
关于antd tree 和父子组件之间的传值问题(react 总结)
2021/06/02 Javascript