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 相关文章推荐
基于JavaScript创建动态Dom
Dec 08 Javascript
总结在前端排序中遇到的问题
Jul 19 Javascript
ajax实现加载页面、删除、查看详细信息 bootstrap美化页面!
Mar 14 Javascript
underscore之function_动力节点Java学院整理
Jul 11 Javascript
详解在express站点中使用ejs模板引擎
Sep 21 Javascript
详解Nuxt.js Vue服务端渲染摸索
Feb 08 Javascript
关于TypeScript模块导入的那些事
Jun 12 Javascript
JavaScript设计模式之工厂模式简单实例教程
Jul 03 Javascript
vue-mugen-scroll组件实现pc端滚动刷新
Aug 16 Javascript
vue项目中常见问题及解决方案(推荐)
Oct 21 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
Dec 06 Javascript
jQuery操作选中select下拉框的值代码实例
Feb 07 jQuery
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
世界咖啡生产者论坛呼吁:需要立即就咖啡价格采取认真行动
2021/03/06 咖啡文化
一个查看session内容的函数
2006/10/09 PHP
社区(php&amp;&amp;mysql)二
2006/10/09 PHP
PHP聊天室技术
2006/10/09 PHP
PHP性能优化 产生高度优化代码
2011/07/22 PHP
基于PHP文件操作的详解
2013/06/05 PHP
php echo, print, print_r, sprintf, var_dump, var_expor的使用区别
2013/06/20 PHP
PHP数组实例详解
2016/06/26 PHP
linux平台编译安装PHP7并安装Redis扩展与Swoole扩展实例教程
2016/09/30 PHP
javascript中检测变量的类型的代码
2010/12/28 Javascript
用原生js做个简单的滑动效果的回到顶部
2014/10/15 Javascript
JQuery悬停控制图片轮播——代码简单
2015/08/05 Javascript
js实现当复选框选择匿名登录时隐藏登录框效果
2015/08/14 Javascript
关于input全选反选恶心的异常情况
2016/07/24 Javascript
javascript中setAttribute兼容性用法分析
2016/12/12 Javascript
JS如何实现在页面上快速定位(锚点跳转问题)
2017/08/14 Javascript
vue项目实现记住密码到cookie功能示例(附源码)
2018/01/31 Javascript
vue实现element-ui对话框可拖拽功能
2018/08/17 Javascript
python 回调函数和回调方法的实现分析
2016/03/23 Python
python中logging包的使用总结
2018/02/28 Python
对PyQt5中树结构的实现方法详解
2019/06/17 Python
使用OpCode绕过Python沙箱的方法详解
2019/09/03 Python
Tensorflow限制CPU个数实例
2020/02/06 Python
python try...finally...的实现方法
2020/11/25 Python
Python开发.exe小工具的详细步骤
2021/01/27 Python
基于html和CSS3制作酷炫的导航栏
2015/09/23 HTML / CSS
欧铁通票官方在线销售网站:Eurail.com
2017/10/14 全球购物
美国优质马术服装购买网站:Breeches.com
2019/12/16 全球购物
为自己工作观后感
2015/06/11 职场文书
《雪地里的小画家》教学反思
2016/02/16 职场文书
读鲁迅先生的经典名言
2019/08/20 职场文书
用position:sticky完美解决小程序吸顶问题的实现方法
2021/04/24 HTML / CSS
Tensorflow与RNN、双向LSTM等的踩坑记录及解决
2021/05/31 Python
Python人工智能之混合高斯模型运动目标检测详解分析
2021/11/07 Python
2022新作动画《福星小子》释出宣传影片 加入内田真礼&宫野真守配音演出
2022/04/08 日漫
索尼ICF-5900W收音机测评
2022/04/24 无线电