Question

我在页面上有很多输入。我想使用jQuery为每个输入的名称和值创建一个关联数组。我试过了：

<input class="activeInput" type="text" name="key1" value="red">
<input class="activeInput" type="text" name="key3" value="France">

inputValues = $('.activeInput').val();

编辑 - 感谢富有洞察力的评论，似乎创建一个对象是一种更好的方法。有关如何创建对象的任何建议吗？

Answer 1

您可以使用.each()迭代元素并将名称和值添加到地图（普通对象）中，如下所示：

var map = {};
$(".activeInput").each(function() {
    map[$(this).attr("name")] = $(this).val();
});

alert(map.key1); // "red"

<强> See it in action

Answer 2

我知道这个问题已经有四年了，接受的答案就足够了。不过，为了完成，我想提供一个答案，因为这个问题是Google上的第一个搜索结果。

jQuery具有版本1.2（2007年发布）的地图功能。可以做一些像下面这样简单的事情（这是不是跨浏览器的解决方案）：

var $inputValues = $('.activeInput').map((i, el) => el.val());

虽然没有人应该在JavaScript中使用箭头功能，但IE或Safari不支持它们。以下是跨浏览器解决方案：

var $inputValues = $('.activeInput').map(function() {
    return $(this).val();
});

重要的是要注意返回值是不是本机数组。当尝试使用Array.prototype中存在的方法时，这可能会导致问题。要将结果转换为数组，可以执行以下操作：

var inputValues = $('.activeInput').map(function() {
    return $(this).val();
}).toArray();

Answer 3

通过循环运行它们可以创建一个具有字符串可访问值的对象。 Javascript没有关联数组的概念，但是使用括号语法可以访问对象的属性，就像关联数组在PHP中工作一样。

var values = {};
$('.activeInput').each(function() {
    values[this.name] = this.value;
});

console.log(values['key1'], values['key3']);
// Note, this is the same as above.
console.log(values.key1, values.key3);

在您的控制台中，您应该看到：红色法国

以下是JsFiddle http://jsfiddle.net/rEtVt/。

这也称为用于快速查找的hashmap（概念）。

Answer 4

var inputValues = new Array();
$('input').each(function(){
    inputValues[$(this).attr('name')] = $(this).val();
});

当然，假设你想要所有输入的值。

话虽如此，我还是注意到了许多不使用和阵列的原因。

Answer 5

如果您需要为ajax提交序列化表单，那么您应该查看serialize和serializeArray jQuery方法。当您有许多具有相同name属性且必须在服务器上创建数组的输入时，可能会发生特殊情况。

否则，我会在表单元素上调用jquery serializeArray并迭代其结果以将其转换为对象。

UPD：添加了示例http://jsfiddle.net/zQNUW/

Answer 6

试试这个：

var values = new Object() // creates a new instance of an object
$('.activeInput').each(function() {
    values[$(this).attr('name')] = $(this).val()
})

检查对象属性：

output = ""
for (property in values) {
  output += property + ': ' + values[property]+'; ';
}
alert(output)

jQuery从输入中获取值并创建一个数组

6 个答案: