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 相关文章推荐
Extjs中DisplayField的日期或者数字格式化扩展
Sep 03 Javascript
一些有用的JavaScript和jQuery的片段分享
Aug 23 Javascript
利用jq让你的div居中的好方法分享
Nov 21 Javascript
JS、DOM和JQuery之间的关系示例分析
Apr 09 Javascript
一道常被人轻视的web前端常见面试题(JS)
Feb 15 Javascript
在javascript中使用com组件的简单实现方法
Aug 17 Javascript
jQuery旋转插件jqueryrotate用法详解
Oct 13 Javascript
JS获取鼠标位置距浏览器窗口距离的方法示例
Apr 11 Javascript
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
Jun 19 Javascript
在angularJs中进行数据遍历的2种方法
Oct 08 Javascript
使用vue制作滑动标签
Sep 21 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实现快速排序法函数代码
2012/08/27 PHP
php 数组元素快速去重
2017/05/05 PHP
PHP unset函数原理及使用方法解析
2020/08/14 PHP
基于JQuery的数字改变的动画效果--可用来做计数器
2010/08/11 Javascript
jQuery登陆判断简单实现代码
2013/04/21 Javascript
浅析javascript操作 cookie对象
2014/12/26 Javascript
使用jspdf生成pdf报表
2015/07/03 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
2016/02/05 Javascript
js获取Html元素的实际宽度高度的方法
2016/05/19 Javascript
js 截取或者替换字符串中的数字实现方法
2016/06/13 Javascript
JS原型链 详解及示例代码
2016/09/06 Javascript
jQuery图片加载显示loading效果
2016/11/04 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
2018/02/03 Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
2018/05/27 Javascript
Three.js中矩阵和向量的使用教程
2019/03/19 Javascript
layui 表格操作列按钮动态显示的实现方法
2019/09/06 Javascript
Node.js API详解之 V8模块用法实例分析
2020/06/05 Javascript
javascript实现时间日期的格式化的方法汇总
2020/08/06 Javascript
[00:17]游戏风云独家报道:DD赛后说出数字秘密 吓死你们啊!
2014/07/13 DOTA
python中使用psutil查看内存占用的情况
2018/06/11 Python
使用python批量化音乐文件格式转换的实例
2019/01/09 Python
python 发送json数据操作实例分析
2019/10/15 Python
python socket通信编程实现文件上传代码实例
2019/12/14 Python
解析Python 偏函数用法全方位实现
2020/06/26 Python
解决Keras的自定义lambda层去reshape张量时model保存出错问题
2020/07/01 Python
Html5之webcoekt播放JPEG图片流
2020/09/22 HTML / CSS
求职者简历中的自我评价
2013/10/20 职场文书
学生个人的自我评价分享
2013/11/05 职场文书
数控专业个人求职信范例
2013/11/29 职场文书
考试违纪检讨书
2014/02/02 职场文书
犯错检讨书
2014/02/21 职场文书
爱心活动计划书
2014/04/26 职场文书
自我查摆剖析材料
2014/10/11 职场文书
python3实现Dijkstra算法最短路径的实现
2021/05/12 Python
MySQL中存储时间的最佳实践指南
2021/07/01 MySQL