Question

我的网页包含一些包含值的输入字段：

<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

我需要Javascript / jQuery来提取这些值并将它们存储在这样的数组中：

var myArray = ["Apple", "Pear"];

有谁知道这样做的方法？

谢谢！

Answer 1

你必须循环输入标签：

＆＃13;

<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

＆＃13;

    var data = [];
    $('input').each(function(){
      data.push($(this).val());
    });
    console.log(data);

＆＃13;

如果您使用JQuery

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input_1" value="Apple">
    <input type="text" id="input_2" value="Pear">

＆＃13;

        var data = [];
        $(":text").each(function(){ //only searches for input type="text"
          data.push($(this).val());
        });
        console.log(data);

＆＃13;

优化的JQuery：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

＆＃13;

$('.the_class')

＆＃13;

<强>更新

我强烈建议您在所有输入元素中使用公共类，然后像jQuery那样循环使用它们，因为它更加优化。

Answer 2

var arr = []; $('input').each(function(){ arr.push($(this).val()); }); console.log(arr);解决方案。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

＆＃13;

var elems = document.querySelectorAll('input[type="text"]'),
    res = Array.from(elems).map(v => v.value);
    console.log(res);

＆＃13;

或纯粹的js解决方案。

＆＃13;

<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

＆＃13;

stringOne

＆＃13;

Answer 3

使用document.querySelectorAll和Array#map：

＆＃13;

var result = [].map.call(document.querySelectorAll('input'), function (e) {
  return e.value
})

console.log(result)

＆＃13;

<html>
   <body>
      <input type="text" id="input_1" value="Apple">
      <input type="text" id="input_2" value="Pear">
   </body>
</html>

＆＃13;

Answer 4

您可以使用jQuery map()和get()返回值数组。

＆＃13;

var myArray = $('input[type="text"]').map(function() {
  return this.value;
}).get();

console.log(myArray)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="text" id="input_1" value="Apple">
<input type="text" id="input_2" value="Pear">

＆＃13;

从输入字段中提取值并存储在javascript数组中

4 个答案: