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 相关文章推荐
JavaScript移除数组元素减少长度的方法
Sep 05 Javascript
JS的document.all函数使用示例
Dec 30 Javascript
jQuery基于ajax()使用serialize()提交form数据的方法
Dec 08 Javascript
js实现表单及时验证功能 用户信息立即验证
Sep 13 Javascript
Chrome浏览器的alert弹窗禁止再次弹出后恢复的方法
Dec 30 Javascript
jQuery实现火车票买票城市选择切换功能
Sep 15 jQuery
仿淘宝JSsearch搜索下拉深度用法
Jan 15 Javascript
angular 服务的单例模式(依赖注入模式下)详解
Oct 22 Javascript
vue使用localStorage保存登录信息 适用于移动端、PC端
May 27 Javascript
uni-app微信小程序登录并使用vuex存储登录状态的思路详解
Nov 04 Javascript
使用React-Router实现前端路由鉴权的示例代码
Jul 26 Javascript
QT与javascript交互数据的实现
May 26 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
教你如何把一篇文章按要求分段
2006/10/09 PHP
使用PHP实现密保卡功能实现代码&amp;lt;打包下载直接运行&amp;gt;
2011/10/09 PHP
Ubuntu12下编译安装PHP5.3开发环境
2015/03/27 PHP
Laravel 5.5 的自定义验证对象/类示例代码详解
2017/08/29 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
解决 firefox 不支持 document.all的方法
2007/03/12 Javascript
用JS实现一个页面多个css样式实现
2008/05/29 Javascript
jquery提示 &quot;object expected&quot;的解决方法
2009/12/13 Javascript
数组Array进行原型prototype扩展后带来的for in遍历问题
2010/02/07 Javascript
js获取location.href的参数实例代码
2013/08/02 Javascript
浏览器兼容console对象的简要解决方案分享
2013/10/24 Javascript
js实现div闪烁原理及实现代码
2014/06/24 Javascript
JavaScript实现将文本框的值插入指定位置的方法
2015/08/13 Javascript
浅谈JavaScript 覆盖原型以及更改原型
2016/08/31 Javascript
js无提示关闭浏览器窗口的两种方法分析
2016/11/06 Javascript
bootstrap weebox 支持ajax的模态弹出框
2017/02/23 Javascript
jQuery实现html table行Tr的复制、删除、计算功能
2017/07/10 jQuery
js中arguments对象的深入理解
2019/05/14 Javascript
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
2019/11/06 Javascript
python获取指定目录下所有文件名列表的方法
2015/05/20 Python
Python使用django搭建web开发环境
2017/06/09 Python
Python 使用with上下文实现计时功能
2018/03/09 Python
Django 实现Admin自动填充当前用户的示例代码
2019/11/18 Python
Python Selenium截图功能实现代码
2020/04/26 Python
利用Python实现字幕挂载(把字幕文件与视频合并)思路详解
2020/10/21 Python
Python爬虫教程之利用正则表达式匹配网页内容
2020/12/08 Python
印度尼西亚最大和最全面的网络商城:Blibli.com
2017/10/04 全球购物
Made in Design意大利:现代家具、名家灯具和装饰
2020/10/27 全球购物
夜班门卫岗位职责
2013/12/09 职场文书
理发店策划方案
2014/06/05 职场文书
医院科室评语
2015/01/04 职场文书
岗位职责范本大全
2015/02/26 职场文书
工作表现证明
2015/06/15 职场文书
中国十大神话动漫电影排行榜 哪吒登顶 白蛇缘起排第七
2022/03/21 国漫
如何使用python包中的sched事件调度器
2022/04/30 Python
JS函数式编程实现XDM一
2022/06/16 Javascript