javascript - inarray - jquery set value input

jQuery obtiene valores de las entradas y crea una matriz

Question

Tengo muchas entradas en una página. Quiero crear una matriz asociativa con el nombre y el valor de cada entrada utilizando jQuery. He intentado:

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

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

EDITAR: gracias a los comentarios perspicaces, parece que crear un objeto es una mejor manera de hacerlo. ¿Alguna sugerencia sobre cómo crear un objeto en su lugar?

Answer 1

Al ejecutarlos a través de un bucle, puede crear un objeto con valores accesibles de cadena. Javascript no tiene el concepto de una matriz asociativa, pero con la sintaxis de corchete puede acceder a las propiedades de un objeto de la misma manera que una matriz asociativa funciona en 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);

En tu consola deberías ver: Francia roja

Aquí hay un JsFiddle http://jsfiddle.net/rEtVt/ para ello.

Esto también se conoce como un hashmap (concepto) utilizado para búsquedas rápidas.

Answer 2

Prueba esto:

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

Para comprobar las propiedades del objeto:

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

Answer 3

Puede usar .each() para iterar sobre los elementos y agregar los nombres y valores a un mapa (un objeto plano) como este:

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

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

Véalo en acción .

Answer 4

Si necesita serializar el formulario para el envío de ajax, entonces debería echar un vistazo a los métodos serialize y serializeArray jQuery. Pueden ocurrir casos especiales cuando tiene muchas entradas con el mismo atributo de name que tienen que hacer una matriz en el servidor.

De lo contrario, llamaría a jquery serializeArray en el elemento de formulario y repetiría sus resultados para convertirlo en objeto.

UPD: ejemplo añadido http://jsfiddle.net/zQNUW/

Answer 5

Soy consciente de que esta pregunta tiene cuatro años, y la respuesta aceptada es suficiente. Sin embargo, me gustaría contribuir con una respuesta para completarla, ya que esta pregunta es el primer resultado de búsqueda en Google.

jQuery tiene una función de mapa a partir de la versión 1.2 (lanzada en 2007). Se podría hacer algo tan simple como lo siguiente (esto no es una solución de navegador cruzado):

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

Aunque nadie debería usar las funciones de flecha en JavaScript, no son compatibles con IE o Safari. La siguiente es una solución de navegador cruzado:

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

Es importante tener en cuenta que el valor de retorno no es una matriz nativa. Esto podría causar problemas cuando uno intentaría usar métodos que existen en Array.prototype. Para convertir el resultado en una matriz, uno podría hacer lo siguiente:

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

Answer 6

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

Eso es suponiendo, por supuesto, que desea el valor de todas las entradas.

Dicho esto, muchas razones para no usar y Array me han llamado la atención.