JavaScript检测并限制复选框选中个数的方法


Posted in Javascript onAugust 12, 2015

本文实例讲述了JavaScript检测并限制复选框选中个数的方法。分享给大家供大家参考。具体如下:

这里用JavaScript判断复选框中否选中,同时可以限制复选框的选中个数,这是一个比较实用的JS表单判断示例,复选框的是否选中曾经让很多人纳闷,现在好了,这段代码帮你解决了难题。

运行效果截图如下:

JavaScript检测并限制复选框选中个数的方法

具体代码如下:

<html>
<head>
<title>判断复选框中否选中</title>
<script>
var check_num = 0;
function check(){ 
 if(event.srcElement.checked==true)
  check_num++;
 else 
  check_num--;   
 if(check_num>3)
 {
  alert("最多只能选3个!");
  event.srcElement.checked=false;
  check_num--;
 }  
}
</script>
</head>
<body>
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<input type="checkbox" name="test" onClick="check()">
<br>
你只能选择3个复选框。
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
Jquery拖拽并简单保存的实现代码
Nov 28 Javascript
Jquery index()方法 获取相应元素索引值
Oct 12 Javascript
jQuery插件Skippr实现焦点图幻灯片特效
Apr 12 Javascript
浅谈javascript中call()、apply()、bind()的用法
Apr 20 Javascript
JavaScript中的return语句简单介绍
Dec 07 Javascript
常用的Javascript设计模式小结
Dec 09 Javascript
用headjs来管理和加载js 提高网站加载速度
Nov 29 Javascript
ES6学习笔记之正则表达式和字符串正则方法分析
Apr 25 Javascript
JavaScript基于replace+正则实现ES6的字符串模版功能
Apr 25 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
May 17 Javascript
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
JavaScript偏函数与柯里化实例详解
Mar 27 Javascript
JavaScript入门基础
Aug 12 #Javascript
js实现将选中值累加到文本框的方法
Aug 12 #Javascript
javascript实现简单的分页特效
Aug 12 #Javascript
JavaScript实现网站访问次数统计代码
Aug 12 #Javascript
jquery+ajax请求且带返回值的代码
Aug 12 #Javascript
javascript封装简单实现方法
Aug 11 #Javascript
基于Css3和JQuery实现打字机效果
Aug 11 #Javascript
You might like
PHP4和PHP5共存于一系统
2006/11/17 PHP
JavaScript 获取用户客户端操作系统版本
2009/08/25 Javascript
jquery-easyui关闭tab自动切换到前一个tab
2010/07/29 Javascript
javascript闭包的高级使用方法实例
2013/07/04 Javascript
jquery 页面滚动到底部自动加载插件集合
2014/01/31 Javascript
js实现局部页面打印预览原理及示例代码
2014/07/03 Javascript
flag和jq on 的绑定多个对象和方法(必看)
2017/02/27 Javascript
JavaScript中的遍历详解(多种遍历)
2017/04/07 Javascript
Node.JS利用PhantomJs抓取网页入门教程
2017/05/19 Javascript
jQuery实现简单的计时器功能实例分析
2017/08/29 jQuery
jQuery实现的form转json经典示例
2017/10/10 jQuery
详解Vue中组件的缓存
2019/04/20 Javascript
[01:01:13]2018DOTA2亚洲邀请赛 4.5 淘汰赛 Mineski vs VG 第三场
2018/04/06 DOTA
在Python中处理列表之reverse()方法的使用教程
2015/05/21 Python
利用Python破解验证码实例详解
2016/12/08 Python
pandas的唯一值、值计数以及成员资格的示例
2018/07/25 Python
python tornado微信开发入门代码
2018/08/24 Python
python协程之动态添加任务的方法
2019/02/19 Python
使用OpenCV实现仿射变换—旋转功能
2019/08/29 Python
pytorch下使用LSTM神经网络写诗实例
2020/01/14 Python
分享CSS3制作卡片式图片的方法
2016/07/08 HTML / CSS
HTML5实现简单图片上传所遇到的问题及解决办法
2016/01/20 HTML / CSS
【HTML5】Canvas绘制简单图片教程
2016/05/13 HTML / CSS
naturalizer加拿大官网:美国娜然女鞋
2017/04/04 全球购物
Internet主要有哪些网络群组成
2015/12/24 面试题
大学生求职推荐信
2013/11/27 职场文书
先进工作者获奖感言
2014/02/08 职场文书
中学生寄语大全
2014/04/03 职场文书
环保倡议书400字
2014/05/15 职场文书
自愿解除劳动合同协议书
2014/09/11 职场文书
自主招生英文自荐信
2015/03/25 职场文书
社会实践活动总结格式
2015/05/11 职场文书
2015年高一班主任工作总结
2015/05/13 职场文书
2015年学生管理工作总结
2015/05/26 职场文书
springBoot基于webSocket实现扫码登录
2021/06/22 Java/Android
关于Redis的主从复制及哨兵问题
2022/06/16 Redis