Question

直升机，我正在尝试使用选中的复选框保存到数组或对象数据，但它仍然返回错误。我不知道为什么，因为我在每个之前定义了一个变量。

我的代码在这里：

$( ".drinks input" ).change(function() {
  var others = [{}];
  $('.drinks input:checked').each(function (i) {
       others[i]['id'] = $(this).val();
       others[i].quantity = 1;
  });
  console.log(others);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="drinks">
<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3">
</div>

你能帮我解释一下如何正确定义数组？非常感谢你。

Answer 1

您需要创建对象，然后设置其属性

others[i] = {}

$(".drinks input").change(function() {
  var others = [];
  $('.drinks input:checked').each(function(i) {
    others[i] = others[i] || {}
    others[i]['id'] = $(this).val();
    others[i].quantity = 1;
  });
  console.log(others);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="drinks">
  <input type="checkbox" value="1">
  <input type="checkbox" value="2">
  <input type="checkbox" value="3">
</div>

您也可以使用.map()

$(".drinks input").change(function() {
  var others = $('.drinks input:checked').map(function(i) {
    return {
      'id': $(this).val(),
      quantity: 1
    }
  }).get();
  console.log(others);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="drinks">
  <input type="checkbox" value="1">
  <input type="checkbox" value="2">
  <input type="checkbox" value="3">
</div>

Answer 2

others数组只有一个对象，因此当您有多个选中的输入时它会失败。

不是用一个对象初始化，而是每次迭代都可以向数组中添加一个对象。

  var others = [];
  $('.drinks input:checked').each(function (i) {
       others.push({
          id: $(this).val(),
          quantity: 1
       });
  });
  console.log(others);

完整解决方案：

$( ".drinks input" ).change(function() {
   var others = [];
  $('.drinks input:checked').each(function (i) {
       others.push({
          id: $(this).val(),
          quantity: 1
       });
  });
  console.log(others);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="drinks">
<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3">
</div>

Answer 3

尝试以下方法：

＆＃13;

$( ".drinks input" ).change(function() {
  var others = [];
  $('.drinks input:checked').each(function (i) {
       others[i] = others[i] || {}
       others[i].id = $(this).val();
       others[i].quantity = 1;
  });
  console.log(others);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="drinks">
  <input type="checkbox" value="1">
  <input type="checkbox" value="2">
  <input type="checkbox" value="3">
</div>

＆＃13;

Answer 4

最小代码行和工作文件。


    $( ".drinks input" ).change(function() {
        var others = [{}];
        $('.drinks input:checked').each(function (i) {
             others[i] = {'id': $(this).val(),'quantity' : '1'};
        });
        console.log(others);
    });

Demo:- https://jsfiddle.net/5dd4p74t/

Javascript - 每个中的未定义变量

4 个答案: