javascript - 从N个输入中获取特定格式的值

我有一个包含N个元素的数组，并且我有一个函数以一种特定的格式绘制这些元素，将所有0, 2, 4, 6....n中的元素都绘制成div，将所有1, 3, 5, 7...n中的元素都绘制成另一个，我用两个for循环来完成此操作，我对此没有任何问题，问题是我需要从一开始就以相同的方式将这些值放在一起，例如，我有这个数组：5, 6, 5, 6我的html输出是这样的：


  第1区：
  5
  5
  Div2：
  6
  6


我尝试的是创建一个数组，然后用以下函数填充它：

$('#MyDiv input').each(function () {
    array.push(this.value);
});

但是我得到以下数组：5,5,6,6而不是5,6,5,6，我该如何解决呢？

这是我的示例代码：

var sampled = [];
$(document).ready(function () {
  $('#btn').click(function () {
    load();
  });

  $('#btn2').click(function () {
    select();
  });
});

function load() {
  var array = "5, 6, 5, 6, 5, 6";
  var lines = "";
  var lines2 = "";
  var lines3 = "";
  var splitString;
  splitString = array.split(",");
  var total = splitString.length;

  for (var x = 1; x <=total / 2; x++) {
    lines += '<div class="col-md-12 text-center">';
    lines += '<span class="form-control">Piece #' + x + '</span></div>';
  }
  //(1, 3, 5, 6, 7....)
  for (var i = 0; i < total; i++) {
    lines2 += '<div class="col-md-12 form-group">';
    lines2 += '<input id="Input' + i + '" value="' + splitString[i] + '" class="form-control" /></div>';
    i++;
  }
  //(0, 2, 4, 6....)
  for (var s = 0; s < total; s++) {
    s++;
    lines3 += '<div class="col-md-12 form-group">';
    lines3 += '<input id="Input' + s + '" value="' + splitString[s] + '" class="form-control" /></div>';
  }

  $('#Number').html(lines);
  $('#Sampled').html(lines2);
  $('#Dimen').html(lines3);
}

function select() {
  $('#Inputs input').each(function () {
        sampled.push(this.value);
    });
  alert(sampled);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>


<div class="col-md-12" id="Inputs">
  <div id="Number" class="col-md-4">
  </div>
  <div id="Sampled" class="col-md-4">
  </div>
  <div id="Dimen" class="col-md-4">
  </div>
</div>

<button id="btn">Click</button>

<button id="btn2">Select</button>

还有here is my example

最佳答案

var div1Array = [];
var div2Array = [];
$("#Div1 input").each(function() {
    div1Array.push(this.value);
}
$("#Div2 input").each(function() {
    div2Array.push(this.value);
}
var finalArray = [];
for (var i = 0; i < div1Array.length; i++) {
    finalArray.push(div1Array[i]);
    finalArray.push(div2Array[i]);
}

这应适用于两个大小相等的输入。您可以根据需要添加自己的逻辑来处理不同的大小或两个以上的div。

关于javascript - 从N个输入中获取特定格式的值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41145615/