jq 如何获取多选框选中的值

jquery如何获取多选框选中的值，有两种方法

1、通过id获取是否选中（单个）

1）引入jquery文件

2）Html设计如下

<div><span>运动类：</span><div id="div1" style="position:relative;left:80px;margin-top:-16px;"><input type="checkbox" size="12" name="Sports" id="Pingpong"   value="1"/>乒乓球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Badminton"  value="2"/>羽毛球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Basketball" value="3"/>篮球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Billiards"  value="4"/>台球&nbsp;&nbsp;</div><div id="div2" style="position:relative;left:80px;margin-top:10px;"><input type="button" value="提交1" onClick="SaveCheck1()"/>&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" value="提交2" onClick="SaveCheck2()"/></div>       </div>

3）js中获取方法（单个）

var SaveCheck1 = function(){//通过id获取多选框是否选中var pinpong = $('#Pingpong').is(":checked");var badminton = $('#Badminton').is(":checked");var basketball = $('#Basketball').is(":checked");var billiards = $('#Billiards').is(":checked");    //在控制台输出选中值console.log("乒乓球："+pinpong);console.log("羽毛球："+badminton);    console.log("篮球："+basketball);    console.log("台球："+billiards);                        }

4）运行的结果

2、通过name获取是否选中（一组）

1）引入jquery文件（如上）

2）Html设计（如上）

3）js获取选中值（一组）

var SaveCheck2 = function(){var arry = new Array();//循环所有选中的值$('input[name="Sports"]:checked').each(function(index, element) {//追加到数组中arry.push($(this).val());});//将数组元素连接起来转化为字符串var arrystr = arry.join(',');//输出到控制台console.log("选中值："+ arrystr);}

4）运行的结果

3、整个demo源码

<!doctype html>
<html><head><meta charset="utf-8"><title>如何获取多选框选中的值</title></head><script src="jquery.min.js"></script><script>        var SaveCheck1 = function(){//通过id获取多选框是否选中var pinpong = $('#Pingpong').is(":checked");var badminton = $('#Badminton').is(":checked");var basketball = $('#Basketball').is(":checked");var billiards = $('#Billiards').is(":checked");    //在控制台输出选中值
            console.log("乒乓球："+pinpong);console.log("羽毛球："+badminton);    console.log("篮球："+basketball);    console.log("台球："+billiards);                        }var SaveCheck2 = function(){var arry = new Array();//循环所有选中的值
            $('input[name="Sports"]:checked').each(function(index, element) {//追加到数组中
                arry.push($(this).val());});//将数组元素连接起来转化为字符串var arrystr = arry.join(',');//输出到控制台
            console.log("选中值："+ arrystr);}</script><body><div><span>运动类：</span><div id="div1" style="position:relative;left:80px;margin-top:-16px;"><input type="checkbox" size="12" name="Sports" id="Pingpong"   value="1"/>乒乓球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Badminton"  value="2"/>羽毛球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Basketball" value="3"/>篮球&nbsp;&nbsp;<input type="checkbox" size="12" name="Sports" id="Billiards"  value="4"/>台球&nbsp;&nbsp;</div><div id="div2" style="position:relative;left:80px;margin-top:10px;"><input type="button" value="提交1" onClick="SaveCheck1()"/>&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" value="提交2" onClick="SaveCheck2()"/></div>       </div>    </body>
</html>

转载于:https://www.cnblogs.com/xielong/p/8176241.html

jq 如何获取多选框选中的值相关推荐

js怎么获取复选框选中的值
本篇文章主要给大家介绍js获取复选框选中的值的实现方法. js获取复选框选中的值的方法实现,对于新手小白来说可能有一定的难度. 下面我们就结合具体的代码示例为大家详细介绍js实现获取复选框中选中的值的 ...
js 获取复选框选中的值
一单选框的值代码: $("input[type='radio']:checked").val() 二获取多选框的值: 思路:利用name属性值获取checkbox对象,然后循 ...
ajax获取复选框选中的值,获取checkbox中被选中的值
~~~ --------------------html部分--------------------------------- 1 2 3 4 5 6 7 8 js jquery ---------- ...
java如何获取复选框选中的值
前台代码: <form action="" method="get"> 您喜欢的水果?<br /><br /> <la ...
支付宝小程序获取复选框选中值id，使其显示且可编辑
问题概述在做支付宝小程序编辑表单时,需要将用户之前填.选的信息显示出来后再编辑.这里针对复选框选中值的获取显示,通过服务端发送请求后拿到的选中id,显示选中值并且可编辑. axml代码片段 < ...
JavaScript案例全选获取下拉框选中的值
<script type="text/javascript">function choice(obj){var checkbox = document.getEleme ...
layui复选框怎么取值_layui获取多选框中的值方法
layui获取多选框中的值方法 HTML: title="=$value;?>"> js: $("input:checkbox[name='standard' ...
微信小程序获取多选框选中值和选中值对应的id
微信小程序开发交流qq群 173683895 承接微信小程序开发.扫码加微信. 官方文档中只有获取多选框的值的方法,但是我需要获取选中的值同时还要获取选中值对应的id,但是又不能操作DOM获 ...
jquery循环复选框选中的值_jquery获取复选框被选中的值
这篇文章主要介绍了jquery获取复选框被选中的值的方法,需要的朋友可以参考下 JS获取复选框被选中的值 0 1 2 3 4 5 6 7 JS代码对checkbox的其他几个操作 1. 全选 2. ...

jq 如何获取多选框选中的值

jq 如何获取多选框选中的值相关推荐

最新文章

热门文章