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


Posted in Javascript onJune 14, 2012
<input type="checkbox">: 
2012欧洲杯"死亡之组"小组出线的国家队是:<br> 
<input type="checkbox" name="nation" value="Germany">德国 
<input type="checkbox" name="nation" value="Denmark">丹麦 
<input type="checkbox" name="nation" value="Holland">荷兰 
<input type="checkbox" name="nation" value="Portugal">葡萄牙

1、小组第一名和第二名出线,所以要限制只能选两项。

var len = $("input[name='nation']:checked").length; 
if(len==0) { 
alert("请选择出线的国家队!"); 
return false; 
}else if(len<2) { 
alert("请选择两个国家队!"); 
return false; 
}else if(len>2) { 
alert("只能选择两个国家队!"); 
return false; 
}else { 
return true; 
}

2、遍历已选择的国家队。

$("input[name='nation']:checked").each(function(){ 
alert("已选择的国家队: "+$(this).val()); 
});

3、取消所有选中的国家队。

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

4、指定选中两个国家队。

$("input[name='nation'][value='Germany']").attr("checked",true); 
$("input[name='nation'][value='Holland']").attr("checked",true);

5、禁止选择国家队。

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

6、允许选择国家队。

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

7、选中索引为偶数或者奇数的国家队(索引是从0开始)。

//选中索引为偶数的国家队 
$("input[name='nation']:even").attr("checked",true); 
//选中索引为奇数的国家队 
$("input[name='nation']:odd").attr("checked",true);
Javascript 相关文章推荐
jquery怎样实现ajax联动框(二)
Mar 08 Javascript
uploadify在Firefox下丢失session问题的解决方法
Aug 07 Javascript
Jquery 例外被抛出且未被接住原因介绍
Sep 04 Javascript
javascript阻止浏览器后退事件防止误操作清空表单
Nov 22 Javascript
JS之Date对象和获取系统当前时间详解
Jan 13 Javascript
jquery的each方法使用示例分享
Mar 25 Javascript
JQuery球队选择实例
May 18 Javascript
ng-events类似ionic中Events的angular全局事件
Sep 05 Javascript
微信小程序开发之tabbar图标和颜色的实现
Oct 17 Javascript
详解使用React.memo()来优化函数组件的性能
Mar 19 Javascript
小程序绑定用户方案优化小结
May 15 Javascript
Vue的编码技巧与规范使用详解
Aug 28 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
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
Jun 14 #Javascript
You might like
php中用于检测一个地理IP地址是否可用的代码
2012/02/19 PHP
PHP采用自定义函数实现遍历目录下所有文件的方法
2014/08/19 PHP
javascript Ext JS 状态默认存储时间
2009/02/15 Javascript
对xmlHttp对象的理解
2011/01/17 Javascript
JavaScript入门之事件、cookie、定时等
2011/10/21 Javascript
鼠标滚轮控制网页横向移动实现思路
2013/03/22 Javascript
关于JS管理作用域的问题
2013/04/10 Javascript
jQuery之折叠面板的深入解析
2013/06/19 Javascript
javascript禁用键盘功能键让右击及其他键无效
2013/10/09 Javascript
跟我学Nodejs(一)--- Node.js简介及安装开发环境
2014/05/20 NodeJs
关于jQuery判断元素是否存在的问题示例探讨
2014/07/21 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
2016/11/02 Javascript
BootStrap组件之进度条的基本用法
2017/01/19 Javascript
js仿拉勾网首页穿墙广告效果
2017/03/08 Javascript
JS获取input[file]的值并显示在页面的实现方法
2018/03/09 Javascript
详解从vue-loader源码分析CSS Scoped的实现
2019/09/23 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
2019/11/04 Javascript
在vant 中使用cell组件 定义图标该图片和位置操作
2020/11/02 Javascript
Python读大数据txt
2016/03/28 Python
Python队列的定义与使用方法示例
2017/06/24 Python
centos 安装python3.6环境并配置虚拟环境的详细教程
2018/02/22 Python
django1.11.1 models 数据库同步方法
2018/05/30 Python
django admin 后台实现三级联动的示例代码
2018/06/22 Python
python3读取csv和xlsx文件的实例
2018/06/22 Python
在Python中用GDAL实现矢量对栅格的切割实例
2020/03/11 Python
CSS3只让背景图片旋转180度的实现示例
2021/03/09 HTML / CSS
Bogner美国官网:滑雪服中的”Dior”
2018/01/30 全球购物
eBay瑞士购物网站:eBay.ch
2018/12/24 全球购物
歌颂祖国的演讲稿
2014/05/04 职场文书
工厂仓管员岗位职责范本
2014/07/17 职场文书
婚礼答谢词
2015/01/04 职场文书
社会实践单位意见
2015/06/05 职场文书
2015初一年级组工作总结
2015/07/24 职场文书
导游词之河北野三坡
2019/12/11 职场文书
python三子棋游戏
2022/05/04 Python