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. 纯手写SpringMVC到SpringBoot框架项目实战

    引言 Spring Boot其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置. 通过这种方式,springboot ...

  2. 模拟实现ATM+购物商城程序

    流程图: 需求: ATM:模拟实现一个ATM + 购物商城程序额度 15000或自定义实现购物商城,买东西加入 购物车,调用信用卡接口结账可以提现,手续费5%支持多账户登录支持账户间转账记录每月日常消 ...

  3. Codeforces Round #439 (Div. 2) Problem E (Codeforces 869E) - 暴力 - 随机化 - 二维树状数组 - 差分

    Adieu l'ami. Koyomi is helping Oshino, an acquaintance of his, to take care of an open space around ...

  4. js导读,js引入,js选择器,事件,操作页面文档,计算后样式,数据类型

    js导读 ''' js属于编写运行在浏览器上的脚本语言 js采用ECMAScript语法 操作BOM:浏览器对象模型 eg:浏览器上下滑动,浏览器历史记录 操作DOM:文档对象模型 ''' js引入 ...

  5. Delphi XE5 for Android (十)

    我觉得Delphi最强大的的功能之一就是开发数据库三层应用的DataSnap,在Android上的实现,首先是完成服务器的设计: (1)利用向导完成DataSnap服务器的框架,如下图: 由于是实验, ...

  6. vue学习【第七篇】:Vue之导入Bootstrap

    Vue引入bootstrap主要有两种方法 方法一:在main.js中引入 此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效 引入jQuery 在当前项目的目录下 ...

  7. 关于no matching key exchange method found. Their offer: diffie-hellman-group1-sha1的解决办法

    原文链接:https://mycyberuniverse.com/error/no-matching-key-exchange-method-found-openssh7.html What caus ...

  8. 终于知道linux firefox不能播放 web在线词典的单词发音了! --通过banshee安装gstreamer1-libav/-plugins-ugly/plugins-bad三个mp3插件.

    mpg123 是一个 命令行的播放器, 他没有gui界面. 直接用 mpg123 test.mp3 就可以直接播放, 而且, 最终要的是, mpg123 自带了mp3的解码器. mpeg: movin ...

  9. hash进阶:使用字符串hash乱搞的姿势

    前言 此文主要介绍hash的各种乱搞方法,hash入门请参照我之前这篇文章 不好意思hash真的可以为所欲为 在开头先放一下题表(其实就是我题解中的hash题目qwq) 查询子串hash值 必备的入门 ...

  10. p2042 维修数列(SPLAY)

    终于yy过去了 撒花 调了一天半,出了无数锅 以下是出锅列表 rotate的时候要判断父亲节点的父亲节点是否存在 rotate的时候记得修改节点的父亲信息 pushdown的时候注意特判有无左右子树 ...