У меня много входов на странице. Я хочу создать ассоциативный массив с именем и значением каждого входа, используя jQuery. Я пытался:
<input class="activeInput" type="text" name="key1" value="red">
<input class="activeInput" type="text" name="key3" value="France">
inputValues = $('.activeInput').val();
РЕДАКТИРОВАТЬ. Благодаря проницательным комментариям кажется, что создание объекта - лучший способ. Любые предложения о том, как создать объект вместо этого?
Вы можете использовать .each() для перебора элементов и добавления имен и значений на карту (обычный объект ) как это:
var map = {};
$(".activeInput").each(function() {
map[$(this).attr("name")] = $(this).val();
});
alert(map.key1); // "red"
.map, чтобы получить $(this).val() из каждого элемента, затем Array.join, чтобы объединить значения.
- person Jon; 19.12.2013
Чтобы создать массив значений, вы можете сделать это:
var $inputValues = $('.activeInput')
.map((i, el) => el.val())
.toArray();
Чтобы создать объект с ключами и значениями, вы можете сделать это:
var data = $('.activeInput')
.toArray()
.reduce((accumulator, element) => {
accumulator[element.name] = element.value;
return accumulator;
}, {});
this уже будет объектом jQuery в этом контексте... Однако вы пропустили одно место.
- person Samuel Willems; 31.10.2017
Запуская их через цикл, вы можете создать объект со строковыми доступными значениями. В 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);
В вашей консоли вы должны увидеть: красная Франция
Вот http://jsfiddle.net/rEtVt/ для этого.
Это также называется хэш-картой (концепцией), используемой для быстрого поиска.
this.name нормально, но .val() работает с <select> элементами, а this.value — нет.
- person Jon; 24.10.2012
<input> элементов!
- person Kevin B; 24.10.2012
var inputValues = new Array();
$('input').each(function(){
inputValues[$(this).attr('name')] = $(this).val();
});
Это предполагает, конечно, что вы хотите получить значение всех входных данных.
При этом до моего сведения было доведено много причин не использовать и Array.
inputValues является массивом, если вы рассматриваете его как объект? После каждого массива длина по-прежнему равна 0.
- person Kevin B; 23.10.2012
var inputValues = {}
- person Kevin B; 23.10.2012
var inputValues = new String();. Вот пример: jsfiddle.net/5BkbQ Обратите внимание, как вы получаете точно такие же результаты, используя новую строку, новое регулярное выражение и новый массив. Это потому, что все они являются объектами. Зачем хранить объектные значения в массиве? В этом случае нет смысла. То, что это работает, не означает, что вы должны это делать.
- person Kevin B; 23.10.2012
Если вам нужно сериализовать форму для отправки ajax, вам следует взглянуть на serialize и serializeArray методы jQuery. Особые случаи могут возникнуть, когда у вас есть много входных данных с одним и тем же атрибутом name, которые должны создавать массив на сервере.
В противном случае я бы вызвал jquery serializeArray для элемента формы и перебрал его результаты, чтобы преобразовать его в объект.
UPD: добавлен пример http://jsfiddle.net/zQNUW/
Попробуй это:
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)
.val() получает только значение первого ввода. (и в этом ответе точно такой же код, как и в вопросе, который не работает.)
- person Kevin B; 23.10.2012
values.$(this).attr('name') не работает. values[$(this).attr('name')]
- person Kevin B; 23.10.2012
.val()получает только значение первого ввода. Вы пробовали что-нибудь еще? - person Kevin B schedule 23.10.2012