jquery为许多输入创建数组

时间:2017-11-01 08:55:49

标签: jquery arrays loops

我需要使用jquery从许多输入创建数组。我需要来自console.log(arr);

的结果
[{size: "m", quantity: "1"},{size: "l", quantity: "2"}]

而我因为循环而得到两个相同的输出。

[{size: "m", quantity: "1"},{size: "l", quantity: "2"},{size: "m", quantity: "1"},{size: "l", quantity: "2"}]

这是html的一部分

<input type="hidden" name="size" id="size1" value="m">
<input type="hidden" name="size" id="size2" value="l">
<input type="text" name="qty" value="1" style="width: 30px;">
<input type="text" name="qty" value="2" style="width: 30px;">

这是jquery

  $('#updatecart').click(function(){
    var values = $('input[name="qty"]');

    var myArray = $.map(values, function(element) {
      return { quantity: element.value};
      //  return element.value;
    });

    var arr = [];

    for (var i = 0; i < myArray.length; i++) {
      $('input[name="size"]').each(function(){
        var t = $(this).val();
        arr.push({ size: t, quantity:myArray[i].quantity });
      });

    }

    console.log(myArray);
    console.log(arr);

  });

提前致谢。

1 个答案:

答案 0 :(得分:0)

i添加到function(element),然后使用size: $('input[name="size"]:eq('+i+')').val()

返回[{size: "m", quantity: "1"},{size: "l", quantity: "2"}]

<强>演示

$('#updatecart').click(function() {
  var values = $('input[name="qty"]');

  var myArray = $.map(values, function(element,i) {
    return {
      size: $('input[name="size"]:eq('+i+')').val(),
      quantity: element.value
    };
    //  return element.value;
  });
  console.log(myArray);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="size" id="size1" value="m">
<input type="hidden" name="size" id="size2" value="l">
<input type="text" name="qty" value="1" style="width: 30px;">
<input type="text" name="qty" value="2" style="width: 30px;">

<button id="updatecart">run</button>

[{size: "m", quantity: "1"},{size: "l", quantity: "2"}]