Bucle sobre elementos en jQuery

Question

Quiero recorrer los elementos de un formulario HTML y almacenar los valores de los campos < de entrada > en un objeto. El código siguiente no funciona, sin embargo:

function config() { 
    $("#frmMain").children().map(function() { 
     var child = $("this"); 
     if (child.is(":checkbox")) 
      this[child.attr("name")] = child.attr("checked"); 
     if (child.is(":radio, checked")) 
      this[child.attr("name")] = child.val(); 
     if (child.is(":text")) 
      this[child.attr("name")] = child.val(); 
     return null; 
    }); 

Ni hace lo siguiente (inspirado por la respuesta de jobscry):

function config() { 
    $("#frmMain").children().each(function() { 
     var child = $("this"); 
     alert(child.length); 
     if (child.is(":checkbox")) { 
      this[child.attr("name")] = child.attr("checked"); 
     } 
     if (child.is(":radio, checked")) 
      this[child.attr("name")] = child.val(); 
     if (child.is(":text")) 
      this[child.attr("name")] = child.val(); 
    }); 
} 

La alerta se referirá child.length == 0. La selección manual de los elementos de obra:

  
>>> $("#frmMain").children() 
Object length=42 
>>> $("#frmMain").children().filter(":checkbox") 
Object length=3 

¿Alguna pista sobre cómo hacerlo en la horquilla?

Answer 1

no creo que se necesita citas en esto:

var child = $("this"); 

intento:

var child = $(this); 

Answer 2

jQuery tiene una función excelente para recorrer a través de un conjunto de elementos: .each()

$('#formId').children().each(
    function(){ 
     //access to form element via $(this) 
    } 
); 

Answer 3

Dependiendo de para qué necesita a cada niño (si está buscando publicarlo en algún lugar a través de AJA) X) puede hacer ...

$("#formID").serialize() 

Crea una cadena para usted con todos los valores automáticamente.

En cuanto al bucle de objetos, también puede hacerlo.

$.each($("input, select, textarea"), function(i,v) { 
    var theTag = v.tagName; 
    var theElement = $(v); 
    var theValue = theElement.val(); 
}); 

Answer 4

He utilizado el siguiente antes:

var my_form = $('#form-id'); 
var data = {}; 

$('input:not([type=checkbox]), input[type=checkbox]:selected, select, textarea', my_form).each(
    function() { 
     var name = $(this).attr('name'); 
     var val = $(this).val(); 

     if (!data.hasOwnProperty(name)) { 
      data[name] = new Array; 
     } 

     data[name].push(val); 
    } 
); 

Esto se acaba de escribir de la memoria, por lo que podría contener errores, pero esto debería hacer que un objeto llamado data que contiene los valores de todas las entradas.

Tenga en cuenta que tiene que ocuparse de las casillas de verificación de una manera especial, para evitar obtener los valores de las casillas de verificación no marcadas. Lo mismo es probablemente cierto de las entradas de radio.

También tenga en cuenta el uso de matrices para almacenar los valores, como para un nombre de entrada, puede tener valores de varias entradas (casillas de verificación en particular).

Answer 5

si desea utilizar la función de cada uno, que debería tener este aspecto:

$('#formId').children().each( 
    function(){ 
    //access to form element via $(this) 
    } 
); 

Sólo tiene que activar la llave de cierre para un cierre paren. Gracias por señalarlo, Jobscry, me salvaste un tiempo.

Answer 6

para mí todo esto no funcionó. Lo que funcionó para mí fue algo muy simple:

$("#formID input[type=text]").each(function() { 
alert($(this).val()); 
}); 

Answer 7

Ésta es la forma más sencilla de bucle a través de una forma única para acceder a los elementos del formulario. Dentro de cada función puedes verificar y construir lo que quieras. Al construir objetos, tenga en cuenta que querrá declararlo fuera de cada función.

EDITAR JSFIDDLE

La continuación trabajará

$('form[name=formName]').find('input, textarea, select').each(function() { 
    alert($(this).attr('name')); 
});