原料：jquery

直接上代码

html代码

<html>

  <head>

    <title>$Title$</title>

  </head>

  <body>

      <input type="checkbox" value="男">男<br/>

      <input type="checkbox" value="女">女<br/>

    <input type="checkbox" value="男1">男1<br/>

    <input type="checkbox" value="女2">女2<br/>

    <input type="checkbox" value="男3">男3<br/>

    <input type="checkbox" value="女4">女4<br/>

    <input type="button" id="btn" value="btn">

    <script src="/assets/js/jquery1.12.4.js"></script>

  </body>

</html>

　script代码

  <script>

      $("#btn").click(function () {

          var re = [];

          $("body").find("input[type='checkbox']:checked").each(function() {re.push($(this).val());

        })

          console.log(re.join("/"));

      });

   ;

  </script>

　　实例：

结果：

另一种写法（编译器编辑 语法可能会变成红色的，不影响使用）

　　原料：css3的选择器

html代码

<html>

  <head>

    <title>$Title$</title>

  </head>

  <body>

      <input type="checkbox" value="男">男<br/>

      <input type="checkbox" value="女">女<br/>

    <input type="checkbox" value="男1">男1<br/>

    <input type="checkbox" value="女2">女2<br/>

    <input type="checkbox" value="男3">男3<br/>

    <input type="checkbox" value="女4">女4<br/>

      <input type="button"  onclick="box()" value="btn1" />

  <script>

    function box() {

        var res = [];

        document.querySelectorAll("body input:checked").forEach((e)=>{

            if(e.checked){

                res.push(e.value);

            }

        });

        console.log(res.join("/"));

    }

  </script>

  </body>

</html>

　　结果：

　

快速取出选中checkbox的值的更多相关文章

  1. js实现获取选中checkbox的值

    var bookVersionId = []; var examVirtualSetResultId; $.each($('input[type=checkbox]:checked'),functio ...

  2. Jquery常用radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置

    获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); 获取select被选中项的文本:var item = $(" ...

  3. easyui 》 radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  4. checkbox 选中、取值处理

    [1].[代码] checkbox 选中.取值处理 跳至 [1] ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  5. jquery radio取值，checkbox取值，select取值及选中

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $('in ...

  6. 设置checkbox选中，设置radio选中，根据值设置checkbox选中，checkbox勾选

    设置checkbox选中,设置radio选中,根据值设置checkbox选中,checkbox勾选 >>>>>>>>>>>>&g ...

  7. JavaScript- 获得TreeView CheckBox里选中项的值

    获得TreeView CheckBox里选中项的值,对JSDOM控制还不是很熟,感觉不太容易.试了很多次终于成功了. 代码如下 <body> <form id="form1 ...

  8. 解决easyui datagrid加载数据时，checkbox列没有根据checkbox的值来确定是否选中

    背景:   昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...

  9. jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中

    jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...

随机推荐

  1. Ubuntu18.04.3主力开发机使用记录（一）

    现在是2019年12月02日,在公司使用Ubuntu作为开发机器已经有一段时间了 查看主分区创建时间 安装时间8月26 当时周一,一个新的迭代刚刚开始,早上来到公司发现开不了机:Windows报错蓝屏 ...

  2. PTA (Advanced Level)1035.Password

    To prepare for PAT, the judge sometimes has to generate random passwords for the users. The problem ...

  3. css动画(transition/transform/animation)

    在开发中,一个好的用户操作界面,总会夹杂着一些动画.css用对少的代码,来给用户最佳的体验感,下面我总结了一些css动画属性的使用方法及用例代码供大家参考,在不对的地方,希望大佬直接拍砖评论. 1 t ...

  4. typora数学符号大全

  5. 剑指offer10：2*1的小矩形横着或者竖着去覆盖2*n的大矩形，总共有多少种方法？

    1. 题目描述 我们可以用2*1的小矩形横着或者竖着去覆盖更大的矩形.请问用n个2*1的小矩形无重叠地覆盖一个2*n的大矩形,总共有多少种方法? 2.思路和方法 思路:(下面说到的x*y的矩形,x是宽 ...

  6. 深入理解Python中的GIL（全局解释器锁)

    深入理解Python中的GIL(全局解释器锁) Python是门古老的语言,要想了解这门语言的多线程和多进程以及协程,以及明白什么时候应该用多线程,什么时候应该使用多进程或协程,我们不得不谈到的一个东 ...

  7. WPF——Application

    Application类处于WPF应用程序的最顶端,main函数就在这个类中. Application类的作用: 截图连接 https://docs.microsoft.com/zh-cn/dotne ...

  8. curl 的使用

    curl 的使用 作者:与蟒唯舞链接:https://www.jianshu.com/p/f05bbd5007d9 curl 是一种命令行工具,作用是发出网络请求,然后获取数据,显示在"标准 ...

  9. Const指针 、 指向const的指针 、引用、指针

    1. const指针和 指向const的指针 指向const的指针: 不允许通过指针来改变其指向的const值 const double *cptr *cptr = 42;  // error! 指针 ...

  10. VSCode主题自定义（附详细注释及本人主题分享）

    先来一张本人自己配置的主题截图,喜欢的拿去用: 下面说说怎么自定义主题: 1.     Ctrl + ,(Ctrl键 + 逗号键):打开设置,也可以依次点击编辑器左上角 => 文件 => ...