Javascript 如何在jquery中获取复选框的值_Javascript_Jquery_Html_Checkbox

Javascript 如何在jquery中获取复选框的值

javascript jquery html checkbox

Javascript 如何在jquery中获取复选框的值,javascript,jquery,html,checkbox,Javascript,Jquery,Html,Checkbox,我有以下html代码，它使用复选框对齐作为一行 <tr class="reg_name"> <th class="custom-th">Reg. Name</th> <td class="text-center"><input type="checkbox" name="reg_name[]" value="Y:1"></td> <td class="text-center"><input ty

我有以下html代码，它使用复选框对齐作为一行

<tr class="reg_name">
  <th class="custom-th">Reg. Name</th>
  <td class="text-center"><input type="checkbox" name="reg_name[]" value="Y:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name[]" value="N:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name[]" value="B:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name[]" value="I:1"></td>
</tr>


规则。名称

用按钮

<button type="button" class="purchase__save btn btn-default pull-right">Save</button>

保存

这个js代码

$(document).ready(function() {
  $('.purchase__save').click(function() {
    var box_array = [];
    var boxes = $('.reg_name input[name="reg_name[]"]:checked');
    for (var i = 0; i < boxes.length; i++) {
      box_array[i] = boxes.val();
    }
    console.log(box_array);
  });
});

$（文档）.ready（函数（）{
$（'.purchase\u save'）。单击（函数（）{
var-box_数组=[]；
变量框=$（'.reg_name输入[name=“reg_name[]”：选中”）；
对于（变量i=0；i


将尝试获取复选框的值
问题在于，如果尝试同时选中两个复选框，则
这是我唯一得到的东西
如果选中了其他复选框，如何获取它们的值？
您正在循环查看您的框
结果，但只读取第一个复选框
for (var i = 0; i < boxes.length; i++) {
  box_array[i] = boxes.val();
}


规则。名称
保存
，因为您没有为输入指定id或名称，所以需要从不同的方式访问它们
$.('.text-center > input:checked')

这应该能奏效。您可以使用“文本中心”类搜索所有项目，并使用选中的选择器搜索它们的直接输入子项
编辑这将返回JQuery对象并注意Jamiec答案
 问题是因为您正在访问元素集合的val（）
，这意味着它将只检索集合中第一个元素的值
您可以通过使用map（）
构建数组来改进此代码：
$('.purchase__save').click(function() {
    var box_array = $('.reg_name input[name="reg_name[]"]:checked').map(function() {
        return this.value;
    }).get();

    // use the array as required here...
});

工作示例
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script>
$(document).ready(function() {
  $('.purchase__save').click(function() {
    var box_array = [];
    $("input:checkbox[name=reg_name]:checked").each(function(){
    box_array.push($(this).val());
    });
    console.log(box_array);
  });
});
</script>
</head>
<body>
<tr class="reg_name">
  <th class="custom-th">Reg. Name</th>
  <td class="text-center"><input type="checkbox" name="reg_name" value="Y:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name" value="N:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name" value="B:1"></td>
  <td class="text-center"><input type="checkbox" name="reg_name" value="I:1"></td>
</tr>
<button type="button" class="purchase__save btn btn-default pull-right">Save</button>
</body>
</html>


$（文档）.ready（函数（）{
$（'.purchase\u save'）。单击（函数（）{
var-box_数组=[]；
$（“输入：复选框[name=reg\u name]：选中”）。每个（函数（）{
box_array.push（$（this.val（））；
});
console.log（box\u数组）；
});
});
规则。名称
拯救
只需使用函数循环每个选中的输入，然后使用函数附加该项即可

$（函数（）{
$（“.purchase\u save”）。单击（函数（）{
var-box_数组=[]；
$（“.reg\u name输入[name='reg\u name[]']：选中”）。每个（函数（i，v）{
box_数组.push（$（v）.val（））；
});
console.log（box\u数组）；
});
});

规则。名称
保存
JavaScript:
$(document).ready(function() {
  $('.purchase__save').click(function() {
    var box_array = [];
    var i = 0;
    var boxes = $('.checkedIn:checked');
    console.log(boxes);
    $(boxes).each(function(){
        box_array[i] = this.value;
      i++;
    });
    console.log(box_array);
  });
});

HTML:

规则。名称
拯救

$（文档）.ready（函数（）{
$（'.purchase\u save'）。单击（函数（）{
var-box_数组=[]；
变量框=$（'input:checkbox:checked'）；
$。每个（框、函数（i、v）{
box_数组[i]=$（this.val（）；
})
console.log（box\u数组）；
});
});

保存@Fil glafd以帮助mate happy编码：）您在jquery中编写代码的方式很漂亮，很好，它帮助您解决问题，很乐意提供帮助。
<tr class="reg_name">
  <th class="custom-th">Reg. Name</th>
  <td class="text-center"><input type="checkbox" class="checkedIn" name="reg_name[]" value="Y:1"></td>
  <td class="text-center"><input type="checkbox" class="checkedIn" name="reg_name[]" value="N:1"></td>
  <td class="text-center"><input type="checkbox" class="checkedIn" name="reg_name[]" value="B:1"></td>
  <td class="text-center"><input type="checkbox" class="checkedIn" name="reg_name[]" value="I:1"></td>
</tr>
<button type="button" class="purchase__save btn btn-default pull-right">Save</button>