js限制checkbox选中个数以限制六个为例


Posted in Javascript onJuly 15, 2014

今天在做项目时,碰到一个问题,我需要展示多个checkbox复选框,而只能允许最多选6个。调试了老半天,终于出来了,代码如下:

<SCRIPT LANGUAGE="JavaScript"> 
var c=0,limit=6; 
function doCheck(obj) { 
obj.checked?c++:c--; 
if(c>limit){ 
obj.checked=false; 
alert("over"); 
c--; 
} 
} 
</SCRIPT> 
<html> 
<body> 
<input type="CHECKBOX" name="sample1" onClick="doCheck(this)">A 
<input type="CHECKBOX" name="sample2" onClick="doCheck(this)">B 
<input type="CHECKBOX" name="sample3" onClick="doCheck(this)">C 
<input type="CHECKBOX" name="sample4" onClick="doCheck(this)">D 
<input type="CHECKBOX" name="sample5" onClick="doCheck(this)">E 
<input type="CHECKBOX" name="sample6" onClick="doCheck(this)">F 
<input type="CHECKBOX" name="sample7" onClick="doCheck(this)">G 
<input type="CHECKBOX" name="sample8" onClick="doCheck(this)">H 
<input type="CHECKBOX" name="sample9" onClick="doCheck(this)">I 
<input type="CHECKBOX" name="sample10" onClick="doCheck(this)">J 
</body> 
</html>

展示结果如下:
js限制checkbox选中个数以限制六个为例

Javascript 相关文章推荐
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
jquery更换文章内容与改变字体大小代码
Sep 30 Javascript
全面理解面向对象的 JavaScript(来自ibm)
Nov 10 Javascript
JQuery调用绑定click事件的3种写法
Mar 28 Javascript
原生js编写基于面向对象的分页组件
Dec 05 Javascript
Angular2管道Pipe及自定义管道格式数据用法实例分析
Nov 29 Javascript
微信小程序中进行地图导航功能的实现方法
Jun 29 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
Jan 09 Javascript
JS中min函数实例讲解
Feb 18 Javascript
React倒计时功能实现代码——解耦通用
Sep 18 Javascript
javascript拖曳互换div的位置实现示例
Jun 28 Javascript
vue实现列表垂直无缝滚动
Apr 08 Vue.js
js用typeof方法判断undefined类型
Jul 15 #Javascript
js的image onload事件使用遇到的问题
Jul 15 #Javascript
js操作IE浏览器弹出浏览文件夹可以返回目录路径
Jul 14 #Javascript
js拼接html注意问题示例探讨
Jul 14 #Javascript
JQuery中使用ajax传输超大数据的解决方法
Jul 14 #Javascript
在Ubuntu上安装最新版本的Node.js
Jul 14 #Javascript
Express作者TJ告别Node.js奔向Go
Jul 14 #Javascript
You might like
DOTA2 6.87版本后新眼位详解攻略
2020/04/20 DOTA
比较全面的PHP数组的使用方法小结
2010/09/23 PHP
PHP如何通过传引用的思想实现无限分类(代码简单)
2015/10/13 PHP
正则表达式搭配js轻松处理json文本方便而老古
2013/02/17 Javascript
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
使用堆实现Top K算法(JS实现)
2015/12/25 Javascript
nodejs 的 session 简单使用
2016/06/06 NodeJs
需灵活掌握的Bootstrap预定义排版类 你精通吗?
2016/06/20 Javascript
JS清除字符串中重复值的实现方法
2016/08/03 Javascript
web前端开发upload上传头像js示例代码
2016/10/22 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
2017/06/09 jQuery
React-Native左右联动List的示例代码
2017/09/21 Javascript
vue resource发送请求的几种方式
2019/09/30 Javascript
JavaScript封装单向链表的示例代码
2020/09/17 Javascript
[01:10:48]完美世界DOTA2联赛PWL S2 GXR vs PXG 第一场 11.18
2020/11/18 DOTA
python实现dict版图遍历示例
2014/02/19 Python
Python实现根据指定端口探测服务器/模块部署的方法
2014/08/25 Python
跟老齐学Python之Python安装
2014/09/12 Python
详解Python中映射类型的内建函数和工厂函数
2015/08/19 Python
谈谈Python进行验证码识别的一些想法
2016/01/25 Python
Python实例方法、类方法、静态方法的区别与作用详解
2019/03/25 Python
Keras使用tensorboard显示训练过程的实例
2020/02/15 Python
Python面向对象程序设计之继承、多态原理与用法详解
2020/03/23 Python
html5+css3之动画在webapp中的应用
2014/11/21 HTML / CSS
自荐信包含哪些内容
2013/10/30 职场文书
半年思想汇报
2013/12/30 职场文书
国际会议邀请函范文
2014/01/16 职场文书
保护环境标语
2014/06/09 职场文书
法学专业大学生实习自我鉴定
2014/10/05 职场文书
劳动纠纷调解协议书格式
2014/11/30 职场文书
2015年大学团支部工作总结
2015/05/13 职场文书
2015年电气技术员工作总结
2015/07/24 职场文书
担保书范文
2019/07/09 职场文书
Golang: 内建容器的用法
2021/05/05 Golang