Question

我有一组复选框，我想将包含一对数字的值添加到数组中，然后使用它们。问题是数组只取最后一个复选框的值。我挣扎了很多但是无法理解。

HTML：

<div class="scrolly-option" id="input-option20">
    <div>
        <label>
            <input type="checkbox" name="option[20][]" value="20,64">
            <span>Mint</span> </label>
    </div>
    <div>
        <label>
            <input type="checkbox" name="option[20][]" value="20,63">
            <span>Maroon</span> </label>
    </div>
    <div>
        <label>
            <input type="checkbox" name="option[20][]" value="20,62">
            <span>Ecru</span> </label>
    </div>
</div>
<input type="checkbox" class="option1" name="" value="" />
<div class="result"></div>
<button type="button" class="button-cart">ADD</button>

JS：

$('.button-cart').on('click', function(e) {
  e.preventDefault;
  var firstoptoins = [];
  $(".scrolly-option input[type=checkbox]").each(function () {
    if ($(this).prop('checked')) {
      var arr = $(this).val().split(',');
      firstoptoins[arr[0]] = arr[1];
    }
  });

  console.log(firstoptoins);

  $('.scrolly-option .checkbox input[type=checkbox]').prop("checked", false);

  $.each(firstoptoins, function (o, v) {
    $('.option1').attr("name", 'option[' + o + '][]');
    $('.option1').attr("value", v);
    $('.option1').prop('checked', true);
    console.log('o: ' + o + ' v: ' + v);
  });
});

Answer 1

您使用第一个数字作为20的索引，这就是为什么您只在阵列上获得一个元素的原因。

元素firstoptoins[20]将在每个循环中被替换。

您可以执行以下操作：

var firstoptoins = [];

$(".scrolly-option input[type=checkbox]").each(function () {
        if ($(this).prop('checked')) {
            var arr = $(this).val().split(',');
            firstoptoins.push( [ arr[0], arr[1] ] );
        }
});

console.log(firstoptoins);

这将导致：

[ 
    [ "20", "64" ],
    [ "20", "63" ],
    [ "20", "62" ] 
]

第二个循环将是：

$.each(firstoptoins, function (o, v) {
    $('.option1').attr("name", 'option[' + v[0] + '][]');
    $('.option1').attr("value", v[1]);
    $('.option1').prop('checked', true);
    console.log('o: ' + v[0] + ' v: ' + v[1]);
});

使用v[0]代表第一个数字，v[1]代表第二个数字

如何将对键，值添加到jQuery数组？

1 个答案: