JavaScript检测并限制复选框选中个数的方法
本文实例讲述了JavaScript检测并限制复选框选中个数的方法。分享给大家供大家参考。具体如下:
这里用JavaScript判断复选框中否选中,同时可以限制复选框的选中个数,这是一个比较实用的JS表单判断示例,复选框的是否选中曾经让很多人纳闷,现在好了,这段代码帮你解决了难题。
运行效果截图如下:
具体代码如下:
<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简单判断复选框是否选中及取出值的方法.分享给大家供大家参考.具体如下: 这里使用JavaScript 获取复选框的值,有朋友在刚开始利用表单提交数据的时候,一般都会遇到表单中有一个特别的元素--复选框,判断它是否选中以及获取它的值 ,好像跟其它的表单元素有点不一样,本代码将为您展示如何获取复选框的值并判断是否被选中. 运行效果如下图所示: 具体代码如下: <title>JavaScript 获取复选框的值</title> <script>
-
javascript实现复选框选中属性
熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好了.博主之前用户不少方法,经常Google到一些这个不好那个不好的文章,到后面自己都混乱了.今天偶然看到一篇外国的博客,觉得讲解的很不错,打算翻译成中文,并加上了一些自己的见解. 如果你从事web开发并且在你开发的网页中有复选框,你可能需要判断当前该复选框是否选中,进而执行一些条件语句.有很多种方法来判断一个复选框是否选中. 让我们先来看看原生的javascr
-
JavaScript限定复选框的选择个数示例代码
有10个复选框,用户最多只能勾选3个,否则就灰掉所有复选框. (用户再次勾掉复选框时,仍然可以再次选择.) 将可变的部分设置为JS的参数,以实现代码复用. JS代码 第一个参数为复选框的name,第二个参数为最多允许的勾选值. 复制代码 代码如下: function choicetest(name,num){ var choicearr = document.getElementsByName(name); var a=0; for(var i=0;i<choicearr.length;i++)
-
javascript实现复选框超过限制即弹出警告框的方法
本文实例讲述了javascript实现复选框超过限制即弹出警告框的方法.分享给大家供大家参考.具体实现方法如下: <html> <title>javascript实现复选框超过限制即弹出警告框的方法</title> <body> <SCRIPT LANGUAGE="JavaScript"> <!--// function countChoices(obj) { max = 2; box1 = obj.form.box1.
-
javascript 设置某DIV区域内的checkbox复选框
<!--HTML代码片段如下: --> 复制代码 代码如下: <div id="div1"> <input type="checkbox" onclick="selectCheckBoxes('div1', this.checked)" />全选<br/> <input type="checkbox" /><br/> <input type=&quo
-
比较实用的复选框的实用javascript脚本
在很多网站里这都是一个很常见的效果,就是点击总分类的复选框,自动选择所有子分类的复选框,或者如果子分类的所有复选框全部被选中则总分类复选框也自动被选中. 这次偶时再msn的网站上偶然看到的,于是自己也试着写了下. function checkAll(str){ var a=document.getElementById("t"+str).getElementsByTagName("input"); var b=document.getElementById(&quo
-
javascript 复选框选择/全选后特效
运行效果 @charset "utf-8"; .content form { margin:0; } table { border:1px solid #CCC; background:#E4E4E4; } td { border-top:1px solid #CCC; background:#FFF; font-size:12px; } th,td,.quantity { text-align:center; font-family:Arial, Helvetica, sans-se
-
javascript实现选中复选框后相关输入框变灰不可用的方法
本文实例讲述了javascript实现选中复选框后相关输入框变灰不可用的方法.分享给大家供大家参考.具体如下: 在一些网站上经常会看到的这种功能,选中复选框,相关的选项为变灰色,不可用,看上去会专业一些,也是提升用户体验的一种方式. 运行效果如下图所示: 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>选
-
javascript判断单选框或复选框是否选中方法集锦
提示:getEmementsByName方法的作用是根据 NAME 标签属性的值获取对象的集合. 样例一<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>判断单选框或复选框是否选中</title> </head> <body> <input name
-
javascript获取checkbox复选框获取选中的选项
有关javascript 获取checkbox复选框的实例数不胜数,下面的这个示例,纯js实现的 var form = document.getElementById("form2"); var field = form.elements["test2"]; var option = Dining.getSelectedOption(form, field); var message = ""; for (var i = 0, len = opt
随机推荐
- Javascript生成带参数的二维码示例
- ASP.NET jQuery 实例10 动态修改hyperlink的URL值
- C#使用Jquery zTree实现树状结构显示 异步数据加载
- C#画图之饼图折线图的实现方法
- 完美解决Android Studio集成crashlytics后无法编译的问题
- mysql主从数据库不同步的2种解决方法
- JSP使用ajaxFileUpload.js实现跨域问题
- Java框架SSH结合Easyui控件实现省市县三级联动示例解析
- CSSvista可同时在IE和Fifrefox调试的CSS编辑提供下载
- Linux bash Shell中的变量类型详解
- jquery基本选择器匹配多个元素的实现方法
- jquery 使用点滴函数代码
- jquery得到iframe src属性值的方法
- firefox background-image垂直平铺问题的解决方法
- 探讨数组与字符串输入的问题(C++版)
- Spring Cloud EureKa Ribbon 服务注册发现与调用
- 易语言计次循环首命令使用讲解
- Java实现的进制转换工具类完整示例
- 解决vue 引入子组件报错的问题
- C语言实现酒店管理系统