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 相关文章推荐
js实现运行代码需要刷新的解决方法
Aug 18 Javascript
javascript:void(0)的真正含义实例分析
Aug 20 Javascript
javascript nextSibling 与 getNextElement(node) 使用介绍
Oct 13 Javascript
JS实现文字链接感应鼠标淡入淡出改变颜色的方法
Feb 26 Javascript
jquery插件jquery.beforeafter.js实现左右拖拽分隔条对比图片的方法
Aug 07 Javascript
BootStrap组件之进度条的基本用法
Jan 19 Javascript
JavaScript模拟实现封装的三种方式及写法区别
Oct 27 Javascript
vue + element-ui实现简洁的导入导出功能
Dec 22 Javascript
原生JS实现列表子元素顺序反转的方法分析
Jul 02 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
Apr 18 Javascript
如何提升vue.js中大型数据的性能
Jun 21 Javascript
javascript中layim之查找好友查找群组
Feb 06 Javascript
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
PHP对字符串的递增运算分析
2010/08/08 PHP
php对文件进行hash运算的方法
2015/04/03 PHP
LNMP部署laravel以及xhprof安装使用教程
2017/09/14 PHP
php提取微信账单的有效信息
2018/10/01 PHP
jQuery 选择器理解
2010/03/16 Javascript
点击按钮自动加关注的代码(sina微博/QQ空间/人人网/腾讯微博)
2014/01/02 Javascript
node.js中的buffer.write方法使用说明
2014/12/10 Javascript
使用javascript实现雪花飘落的效果
2015/01/13 Javascript
jquery+javascript编写国籍控件
2015/02/12 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
2015/08/27 Javascript
jQuery插件passwordStrength密码强度指标详解
2016/06/24 Javascript
微信小程序基于slider组件动态修改标签透明度的方法示例
2017/12/04 Javascript
vue项目中vue-i18n和element-ui国际化开发实现过程
2018/04/25 Javascript
总结JavaScript在IE9之前版本中内存泄露问题
2018/04/28 Javascript
微信小程序实现人脸识别
2018/05/25 Javascript
详解封装基础的angular4的request请求方法
2018/06/05 Javascript
Vue常用指令详解分析
2018/08/19 Javascript
在vue项目中集成graphql(vue-ApolloClient)
2018/09/08 Javascript
vue中使用input[type=&quot;file&quot;]实现文件上传功能
2018/09/10 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
原生js实现表格翻页和跳转
2020/09/29 Javascript
JS常用跨域方法实现原理解析
2020/12/09 Javascript
python 读写中文json的实例详解
2017/10/29 Python
python树莓派红外反射传感器
2019/01/21 Python
Python动态导入模块:__import__、importlib、动态导入的使用场景实例分析
2020/03/30 Python
pandas创建DataFrame的7种方法小结
2020/06/14 Python
python3.8动态人脸识别的实现示例
2020/09/21 Python
python使用matplotlib的savefig保存时图片保存不完整的问题
2021/01/08 Python
在html页面中取得session中的值的方法
2020/08/11 HTML / CSS
世界著名的顶级牛排:Omaha Steak(奥马哈牛排)
2016/09/20 全球购物
小学生元旦感言
2014/02/26 职场文书
2014年驾驶员工作总结
2014/11/18 职场文书
地道战观后感2000字
2015/06/04 职场文书
2015暑假假期总结
2015/07/13 职场文书
地震捐款简报
2015/07/21 职场文书
Python可视化神器pyecharts之绘制箱形图
2022/07/07 Python