使用 Javascript 或 Jquery 将 CheckBoxes 值获取到数组或列表答案

【问题标题】：Get CheckBoxes values to Array or List with Javascripts or Jquery使用 Javascript 或 Jquery 将 CheckBoxes 值获取到数组或列表
【发布时间】：2019-07-05 13:36:15
【问题描述】：

我想从选中的复选框中获取值到数组（检查表）中。我试过这段代码，但它似乎不起作用。在for 中，我可以获得推送的“清单”项目，但在for 之后它不能。如何将所有选中的 CheckBox 的值放入数组或列表中？

$(function() {
  $("#btnEkle").click(
    function() {
      var checkbox, checkslist, menuId, text, vModel;
      checkslist = [];
      checkbox = document.getElementsByClassName("checks");

      for (var i = 0; checkbox.length; ++i) {
        if (checkbox[i].checked) {
          menuId = checkbox[i].value;
          checkslist.push(menuId);
        }
      }      
      alert(checkslist[0].value)
    })    
})

【问题讨论】：

标签： javascript arrays list checkbox

【解决方案1】：

问题在于你的 for 循环，

for (var i = 0; checkbox.length; ++i) {

你应该像这样迭代你的循环，

for (var i = 0; i<checkbox.length-1; i++) {
    if (checkbox[i].checked) {
         menuId = checkbox[i].value;
         checkslist.push(menuId);
    }
}

你的警报应该是，

alert(checkslist[0] )

Demo

【讨论】：

【解决方案2】：

您可以循环所有复选框并将它们添加到数组中，如下所示list.push(($(this).prop("checked")));checked 如果选中该框，则返回 true 或 false

function getList() {
  var list = []
  $.each($("input:checkbox"), function() {
    list.push(($(this).prop("checked")));    
  });
  console.log(list)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">

<button onClick="getList()">Get list</button>

【讨论】：

【解决方案3】：

如果您希望所有选中的值都显示在警报中，您应该将它们组合成一个字符串。该函数使用示例函数中的“检查”类获取所有复选框，将那些检查的值添加到数组中，并为包含所有检查值的警报创建一个字符串。返回值数组，以防您想在其他地方使用它。

function getChecked(){
    let checks = document.getElementsByClassName("checks");
    let checked_values = [];
    let checked_values_string = "";
    for(let i=0; i<checks.length; i++){
        if(checks[i].checked){
            checked_values.push(checks[i].value);
            checked_values_string = checked_values_string + checks[i].value + " ";
        }
    }
    alert(checked_values_string);
    return checked_values;
}

【讨论】：