<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

         <script type="text/javascript">

             window.onload = function() {                  //页面所有元素加载完毕

                 var btn = document.getElementById("btn"); //获取id为btn的元素(button)

                 btn.onclick = function() {                //给元素添加onclick事件

                     var arrays = new Array();             //创建一个数组对象

                     var items = document.getElementsByName("check"); //获取name为check的一组元素(checkbox)

                     for(i = 0; i < items.length; i++) {              //循环这组数据

                         if(items[i].checked) {                       //判断是否选中

                             arrays.push(items[i].value);  //把符合条件的 添加到数组中. push()是javascript数组中的方法.

                         }

                     }

                     alert("选中的个数为：" + arrays.length);

                 }

             }

         </script>

     </head>

     <body>

         <form method="post" action="#">

             <input type="checkbox" value="1" name="check" checked="checked" />

             <input type="checkbox" value="2" name="check" />

             <input type="checkbox" value="3" name="check" checked="checked" />

             <input type="button" value="你选中的个数" id="btn" />

         </form>

     </body>

 </html>

JavaScript例子3-对多选框进行操作，输出选中的多选框的个数的更多相关文章

  1. vue中两行代码实现全选及子选项全部选中，则全选按钮选中，反之有一个没选中，就取消选中全选按钮

    every() 方法使用指定函数检测数组中的所有元素: 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测. 如果所有元素都满足条件,则返回 true. 逻辑 ...

  2. jquery对单选和下拉框的操作

    jquery 对表单的操作: 对单选框的操作: 一.对单选框的操作: 1.$('input

  3. jquery如何判断checkbox（复选框）是否被选中(转)

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  4. jQuery实现checkbox（复选框）选中、全选反选代码

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  5. [转]jquery如何判断checkbox（复选框）是否被选中,至少被选中一个

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  6. 选中没有选中的复选框，匹配含有某个字符串的正则，json取值的两种方法，把变量定义在外面跟里面的区别

    一.筛选没有选中的复选框:not("input:checked") 二.匹配有VARCHAR的字符串:".*VARCHAR.*?" 三.json取值的两种方法 ...

  7. js做全选，用一个checkbox复选框做多个checkbox复选框的全选按钮，有一个复选框未被选择时，全选按钮的checked就为false

    用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...

  8. 表格中的checkbox复选框 全选非全选 公共方法 及提交选中结果

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  9. js根据选中的复选框，隐藏那一行

    如图,选择复选框,点击“隐藏”按钮,隐藏选中行 1.JavaScript代码: function getCheckedIds() { var checkedSubject = $('#showSbgl ...

随机推荐

  1. antd源码分析之——折叠面板（collapse）

    官方文档 https://ant.design/components/collapse-cn/ 目录 一.antd中的collapse 代码目录 1.组件结构图(♦♦♦重要) 2.源码节选:antd/ ...

  2. SdCardUtils

    import android.os.Environment; import android.os.StatFs; public class SdCardUtils { public static bo ...

  3. Rvm 进行gem安装时必须输入密码Your user account isn't allowed to install to the system RubyGems 解决方案

    今天开发过程中,从master拉下代码后重启项目,想用控制台时,却发现需要密码??并且三次密码确认后还是疯狂报错. 当时第一想到是rvm版本不一致,随即则检查了版本跟gem生成,当确认rvm版本无误时 ...

  4. Python安装以及简单使用教程

    以windows版本举例: 1.首先去Pycharm官网,或者直接输入网址:http://www.jetbrains.com/pycharm/download/#section=windows,下载P ...

  5. 小D课堂 - 新版本微服务springcloud+Docker教程_5-05熔断降级服务异常报警通知

    笔记 5.熔断降级服务异常报警通知实战     简介:完善服务熔断处理,报警机制完善 1.加入redis依赖         <dependency>             <gr ...

  6. 小D课堂 - 新版本微服务springcloud+Docker教程_5-02 Netflix开源组件断路器

    笔记 2.Netflix开源组件断路器Hystrix介绍     简介:介绍Hystrix基础知识和使用场景          文档地址:         https://github.com/Net ...

  7. React Native安卓代码混淆和打包

    一上午就整了个React Native的打包,中间还遇到各种问题,这里还是记录下吧: 文档链接: http://reactnative.cn/docs/0.45/signed-apk-android. ...

  8. SQL SERVER CLR Trigger功能

    通过在 Microsoft SQL Server 中托管 CLR(称为 CLR 集成),开发人员可以在托管代码中编写存储过程.触发器.用户定义函数.用户定义类型和用户定义聚合函数, 改变了以前只能通过 ...

  9. vue中如何使用event对象

    原文地址 一.event 对象 (一)事件的 event 对象 你说你是搞前端的,那么你肯定就知道事件,知道事件,你就肯定知道 event 对象吧?各种的库.框架多少都有针对 event 对象的处理. ...

  10. C#中？的相关使用

    C#中?的相关使用 今天看了几篇博客,学习了一下与?相关的使用,大致分为一下几种: 1. 可空类型 看标题就能够很好的理解这个概念:可以为空的类型.而在C#中可以为空也就是null的类型,都是引用类型 ...