JavaScript判断表单中多选框checkbox选中个数的方法
本文实例讲述了JavaScript判断表单中多选框checkbox选中个数的方法。分享给大家供大家参考。具体如下：
这里使用JavaScript检测并判断出表单中多选框的选中个数，也就是checkbox被选择了多少，在以前，这个问题经常被各大论坛问到，因为检测checkbox不像检测输入框那么简单，尤其是判断个数也经常会遇到，所以说觉得这个Js代码还是很有用的，大家有兴趣的再完善一下。
运行效果如下图所示：
在线演示地址如下：
http://demo.jb51.net/js/2015/js-checkbox-chk-num-codes/
具体代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>检测表单多选框的选择个数</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> </head> <body> <script language="javascript"> <!-- function anyCheck(form) { var total = 0; var max = form.ckbox.length; for (var idx = 0; idx < max; idx++) { if (eval("document.playlist.ckbox[" + idx + "].checked") == true) { total += 1; } } alert("您选择了 " + total + " 个选项！"); } //--> </script> <form method="post" name="playlist"> 1<input type="checkbox" name="ckbox" value="1"> 2<input type="checkbox" name="ckbox" value="2"> 3<input type="checkbox" name="ckbox" value="3"> 4<input type="checkbox" name="ckbox" value="4"> 5<input type="checkbox" name="ckbox" value="5"> 6<input type="checkbox" name="ckbox" value="6"> <br><input type="button" value="检测选择个数" onClick="anyCheck(this.form)"> </form> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
-
本文向大家介绍checkbox选中与未选中判断示例，包括了checkbox选中与未选中判断示例的使用技巧和注意事项，需要的朋友参考一下
-
本文向大家介绍Bootstrap3 多选和单选框(checkbox)，包括了Bootstrap3 多选和单选框(checkbox)的使用技巧和注意事项，需要的朋友参考一下 多选框（checkbox）用于选择列表中的一个或多个选项，而单选框（radio）用于从多个选项中只选择一个。 设置了 disabled 属性的单选或多选框都能被赋予合适的样式。对于和多选或单选框联合使用的 <label> 标签，
-
本文向大家介绍jquery判断至少有一个checkbox被选中的方法，包括了jquery判断至少有一个checkbox被选中的方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jquery判断至少有一个checkbox被选中的方法。分享给大家供大家参考。具体实现方法如下： html代码部分： jquery代码部分： 希望本文所述对大家的jQuery程序设计有所帮助。
-
本文向大家介绍jQuery判断checkbox是否选中的3种方法，包括了jQuery判断checkbox是否选中的3种方法的使用技巧和注意事项，需要的朋友参考一下 jQuery能够极大提高html的编写效率，其中checkbox的选中判断有几种： 1， $(checkbox的id).prop("checked") 返回的是一个boolean值类型 2， $(this).is(":checked")
-
本文向大家介绍Angular.JS判断复选框checkbox是否选中并实时显示，包括了Angular.JS判断复选框checkbox是否选中并实时显示的使用技巧和注意事项，需要的朋友参考一下 首先来看看简单的效果图，如下所示： 看一下html代码： line2 定义了AngularJS App； line4 引入angularjs脚本； line5 引入自己写的script2.js脚本； line
-
Checkbox 多选框 一组备选项中进行多选 基础用法 单独使用可以表示两种状态之间的切换，写在标签中的内容为 checkbox 按钮后的介绍。 在el-checkbox元素中定义v-model绑定变量，单一的checkbox中，默认绑定变量的值会是Boolean，选中为true。 <template> <!-- `checked` 为 true 或 false --> <el-chec