jquery如何获取checkbox的值

一、总结

一句话总结：就是通过jquery获取哪些对应name的checkbox，然后找出:check（被选中的），然后通过jquery的each遍历获取这些的值即可

$('input[name='checkboxName']:checked')+.each遍历取值

二、使用JQuery获取被选中的checkbox的value值

参考：使用JQuery获取被选中的checkbox的value值
https://www.cnblogs.com/td960505/p/6123510.html

以下为使用JQuery获取input checkbox被选中的值代码:

<html>
    <head>
        <meta charset="gbk">
        <!-- 引入JQuery -->
        <script src="jquery-1.3.1.js" type="text/javascript"></script>
    </head>

<body>
        <input type="checkbox" value="橘子" name="check">橘子1</input>
        <input type="checkbox" value="香蕉" name="check">香蕉1</input>
        <input type="checkbox" value="西瓜" name="check">西瓜1</input>
        <input type="checkbox" value="芒果" name="check">芒果1</input>
        <input type="checkbox" value="葡萄" name="check">葡萄1</input>
        
        <input type="button" value="方法1" id="b1">
        <input type="button" value="方法2" id="b2">

</body>
    
    <script>
        //方法1
        $("#b1").click(function(){
            //$('input:checkbox:checked') 等同于 $('input[type=checkbox]:checked')
            //意思是选择被选中的checkbox
            $.each($('input:checkbox:checked'),function(){
                window.alert("你选了："+
                    $('input[type=checkbox]:checked').length+"个，其中有："+$(this).val());
            });
        });
        
        //方法2
        $("#b2").click(function(){
            $.each($('input:checkbox'),function(){
                if(this.checked){
                    window.alert("你选了："+
                        $('input[type=checkbox]:checked').length+"个，其中有："+$(this).val());
                }
            });
        });
    </script>
</html>

 

jquery如何获取checkbox的值的更多相关文章

  1. jquery 循环获取checkBox的值,以及对复选框选中，取消，操作按钮

    法一:jquery 循环获取选中checkBox框的值 function checkeds() { $("input:checkbox").each(function(index) ...

  2. JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery实时获取checkbox状态问题

    在最近的项目开发中,使用jQuery操作checkbox时,发现一个问题. Html代码如下: <body> <div> <inputtype="checkbo ...

  4. 前端js获取checkbox的值

    1. var old = $("#old").val(); if (old != null && old != 'undefined' && old ...

  5. jquery获取checkbox的值并post提交

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

  6. jQuery之获取checkbox选中的值

    <mce:script src="jquery.js" mce_src="jquery.js"></mce:script><!-- ...

  7. jquery 获取checkbox 选中值并拼接字符集

    1.代码示例: var chk_value =[]; $('input[name="rewardids"]:checked').each(function(){   chk_val ...

  8. attr prop jquery关于获取DOM属性值的两个函数

    $('#domid').attr('acitve') $('#domid').prop('checked') // 在使用JQUERY获取DOM元素的属性时,有两个函数,attr 和 prop < ...

  9. JS获取CHECKBOX的值 AND 两个CHECKBOX 循环选中

    获取多选按钮的值 var chk_value = ''; $('input[data-action="checkRole"]:checked').each(function(){ ...

随机推荐

  1. 08: MySQL慢查询

    1.1 寻找慢查询   定义:我们将超过指定时间的SQL语句查询称为“慢查询”. 1.在mysql日志中开启慢查询日志 1. 修改配置文件  在 my.ini 增加几行:  主要是慢查询的定义时间(超 ...

  2. python简说（十七）操作mysql数据库

    import pymysqlconn = pymysql.connect(host='118.24.3.40',user='jxz',password='123456',port=3306,db='j ...

  3. bzoj 4585 烟火表演 - 动态规划 - 可并堆

    题目传送门 传送门I 传送门II 题目大意 给定一棵带边权有根树,修改一条边的边权的代价是修改前和修改后的值的绝对值之差.不能将一条边的边权改为负数.问使得根节点到所有叶节点的距离相等的最小代价. 当 ...

  4. ODAC（V9.5.15) 学习笔记（五）TSmartQuery

    TSmartQuery是相对于TOraQuery更简洁的数据集,其成员如下 名称 类型 说明 Expand Boolean 缺省为False,如果为True,则表示无论SQL中罗列的字段是哪些,数据集 ...

  5. Docker 搭建Spark 依赖singularities/spark:2.2镜像

    singularities/spark:2.2版本中 Hadoop版本:2.8.2 Spark版本: 2.2.1 Scala版本:2.11.8 Java版本:1.8.0_151 拉取镜像: [root ...

  6. Docker 搭建Spark 依赖sequenceiq/spark:1.6镜像

    使用Docker-Hub中Spark排行最高的sequenceiq/spark:1.6.0. 操作: 拉取镜像: [root@localhost home]# docker pull sequence ...

  7. OpenWRT路由器使用ipv6拨号上网教程

    文章来源于群友,如有侵权,请联系我(aha971030@gmail.com)删除 原理介绍分析: 湖北E信地区可以使用ipv6拨号,好处是网络是上下对等不限速网络,也就是说,你的端口上限是多少,网上就 ...

  8. SQL 检查 Varchar 是否能转换为 NUMERIC

    https://bbs.csdn.net/topics/390480323 ISNUMERIC(size_long)=1 (IIF( ISNUMERIC(size_long)=1 AND ISNUME ...

  9. (转) AdversarialNetsPapers

      本文转自:https://github.com/zhangqianhui/AdversarialNetsPapers AdversarialNetsPapers The classical Pap ...

  10. Python GIL（Global Interpreter Lock）

    一.介绍 In CPython, the global interpreter lock, or GIL, is a mutex that prevents multiple native threa ...