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 相关文章推荐
js解决弹窗问题实现班级跳转DIV示例
Jan 06 Javascript
js弹出确认是否删除对话框
Mar 27 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
Bootstrap超大屏幕的实现代码
Mar 22 Javascript
javascript数据结构之串的概念与用法分析
Apr 12 Javascript
详解jQuery中的isPlainObject()使用方法
Feb 27 jQuery
自定义vue组件发布到npm的方法
May 09 Javascript
Vuex入门到上手教程
Jun 20 Javascript
详解vue中axios的使用与封装
Mar 20 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
Oct 29 Javascript
vue项目在webpack2实现移动端字体自适配功能
Jun 02 Javascript
JS代码简洁方式之函数方法详解
Jul 28 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
php读取javascript设置的cookies的代码
2010/04/12 PHP
[原创]php实现子字符串位置相互对调互换的方法
2016/06/02 PHP
php微信支付之公众号支付功能
2018/05/30 PHP
MacOS下PHP7.1升级到PHP7.4.15的方法
2021/02/22 PHP
jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版
2013/01/11 Javascript
解析JavaScript中的不可见数据类型
2013/12/02 Javascript
ie7+背景透明文字不透明超级简单的实现方法
2014/01/17 Javascript
简介JavaScript中POSITIVE_INFINITY值的使用
2015/06/05 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记9)
2015/12/24 Javascript
JavaScript中文件上传API详解
2016/04/01 Javascript
jQuery UI Bootstrap是什么?
2016/06/17 Javascript
老生常谈JavaScript 函数表达式
2016/09/01 Javascript
Node.JS文件系统解析实例详解
2017/05/15 Javascript
javascript+html5+css3自定义提示窗口
2017/06/21 Javascript
微信小程序实现分享朋友圈的图片功能示例
2019/01/18 Javascript
JS随机密码生成算法
2019/09/23 Javascript
JavaScript canvas基于数组生成柱状图代码实例
2020/03/06 Javascript
Python中input和raw_input的一点区别
2014/10/21 Python
详解Python3.1版本带来的核心变化
2015/04/07 Python
pygame学习笔记(1):矩形、圆型画图实例
2015/04/15 Python
Python实现的异步代理爬虫及代理池
2017/03/17 Python
用python 批量更改图像尺寸到统一大小的方法
2018/03/31 Python
Falsk 与 Django 过滤器的使用与区别详解
2019/06/04 Python
PyQt5 实现给窗口设置背景图片的方法
2019/06/13 Python
Python3 sys.argv[ ]用法详解
2019/10/24 Python
pycharm 的Structure界面设置操作
2021/02/05 Python
html5配合css3实现带提示文字的输入框(摆脱js)
2013/03/08 HTML / CSS
Nike挪威官网:Nike.com (NO)
2018/11/26 全球购物
幼儿园校车司机的岗位职责
2014/01/30 职场文书
教师学习培训邀请函
2014/02/04 职场文书
梅花魂教学反思
2014/04/25 职场文书
颂军魂爱军营演讲稿
2014/09/13 职场文书
2015年技术员工作总结
2015/04/10 职场文书
2016庆祝国庆67周年宣传语
2015/11/25 职场文书
2016年清明节期间群众祭祀活动工作总结
2016/04/01 职场文书
解决Mysql的left join无效及使用的注意事项说明
2021/07/01 MySQL