¿Cómo obtener el tipo de entrada usando jquery?

Question

Tengo una página donde el tipo de entrada siempre varía, y necesito obtener los valores según el tipo de entrada. Entonces, si el tipo es una radio, necesito verificar cuál está marcada, y si es una casilla de verificación, necesito ahora que esté marcada, y si es un menú desplegable, necesito saber cuál está seleccionado, y si es un texto/textarea Necesito saber los valores.

¿Alguna idea de cómo hacer eso?

Answer 1

EDIT 1 de febrero de 2013. Debido a la popularidad de esta respuesta y los cambios en jQuery en la versión 1.9 (2.0) respecto a las propiedades y atributos, que agregó algunas notas y un violín para ver cómo funciona al acceder a propiedades/atributos en la entrada, botones y algunas selecciones. El violín aquí: http://jsfiddle.net/pVBU8/1/

---

conseguir todas las entradas:

var allInputs = $(":input"); 

obtener todo tipo de entradas:

allInputs.attr('type'); 

obtener los valores:

allInputs.val(); 

NOTA: .val() NO es lo mismo como: verificado para esos tipos donde eso es relevante. uso:

.attr("checked"); 

---

EDITAR Feb 1, 2013 - re: jQuery 1.9 uso prop() no attr() como attr no devolverá los valores adecuados para las características que han cambiado.

.prop('checked'); 

o simplemente

$(this).checked; 

---

para obtener el valor del cheque - lo que es actualmente. o simplemente use '': marcado '' si quiere solo aquellos que están marcados.

EDIT: Aquí hay otra manera de conseguir Tipo:

var allCheckboxes=$('[type=checkbox]'); 

Edit2: Tenga en cuenta que la forma de:

$('input:radio'); 

se perferred sobre

$(':radio'); 

el que tanto equiparan a:

$('input[type=radio]'); 

pero se desea la "entrada" de modo que sólo se pone las entradas y no utiliza el universal '*" cuando se utiliza la forma de $(':radio') lo que equivale a $('*:radio');

EDITAR 19 de Ago, 2015: preferencia por la $('input[type=radio]'); debe usarse ya que permite que los navegadores modernos optimicen la búsqueda de una entrada de radio.

---

EDITAR Feb 1, 2013 por comentarios re: seleccionar elementos @dariomac

$('select').prop("type"); 

devolverá o bien "seleccione uno" o "seleccionar múltiples" dependiendo del atributo "múltiple" y

$('select')[0].type 

devuelve lo mismo para la primera selección si existe. y

($('select')[0]?$('select')[0].type:"howdy") 

devolverá el tipo si existe o "howdy" si no lo hace.

$('select').prop('type'); 

devuelve la propiedad del primero en el DOM si existe o "indefinido" si no existe ninguno.

$('select').type 

devuelve el tipo de la primera si existe o un error si no existe.

Answer 2

que podría hacer lo siguiente:

var inputType = $('#inputid').attr('type'); 

Answer 3

$("#yourobj").attr('type'); 

Answer 4

GetValue = function(id) { 
    var tag = this.tagName; 
    var type = this.attr("type"); 

    if (tag == "input" && (type == "checkbox" || type == "radio")) 
    return this.is(":checked"); 

    return this.val(); 
}; 

Answer 5

El mejor lugar para empezar a buscar es http://api.jquery.com/category/selectors/

Esto le dará un buen conjunto de ejemplos.

Ultamatly la selección de elementos en el DOM se logra usando selectores de CSS así que si piensas en obtener un elemento por id querrás usar $ ('# elementId'), si quieres todas las etiquetas de entrada usa $ ('input') y finalmente la parte que creo que querrá si quiere todas las etiquetas de entrada con un tipo de casilla de verificación use $ ('input, [type = checkbox])

Nota: Encontrará la mayor parte del son valores que desee en los atributos de modo que el selector CSS para los atributos es: [attributeName = valor]

el hecho de que pidió el menú desplegable como aposed a un cuadro de lista intente lo siguiente:

$('select, [size]).each(function(){ 
    var selectedItem = $('select, [select]', this).first(); 
}); 

El código era de la memoria así que por favor accound para los pequeños errores

Answer 6

var val = $('input:checkbox:checked, input:radio:checked, \ 
    select option:selected, textarea, input:text', 
    $('#container')).val(); 

Comentarios:

1. supongo, que no es exactamente uno forma de elemento, que puede ser un área de texto, campo de entrada, la forma de selección, un conjunto de botones de radio o una sola casilla de verificación (tendrá que actualizar mi código si necesita más casillas de verificación).

2. El elemento en cuestión vive dentro de un elemento con ID container (para eliminar ambigüedades con otros elementos en la página).

3. El código devolverá el valor primer elemento coincidente que encuentre. Como utilizo :checked y así sucesivamente, este siempre debe ser exactamente el valor de lo que está buscando.

Answer 7

Si lo que estás diciendo es que desea obtener todas las entradas dentro de una forma que tienen un valor sin preocuparse por el tipo de entrada, intente esto:

Ejemplo:http://jsfiddle.net/nfLfa/

var $inputs = $('form').find(':checked,:selected,:text,textarea').filter(function() { 
    return $.trim(this.value) != ''; 
}); 

Ahora debe tener un conjunto de elementos de entrada que tengan algún valor.

Usted puede poner los valores en una matriz:

var array = $inputs.map(function(){ 
    return this.value; 
}).get(); 

O usted podría serializarlos:

var serialized = $inputs.serialize(); 

Answer 8

parecería que la funcionalidad attr se está obsoleto más

$(this).attr('TYPE') 
undefined 
$(this).prop('type') 
"text" 

Answer 9

En mi aplicación, terminé con dos elementos diferentes que tienen la misma identificación (incorrecta). Un elemento era un div y el otro una entrada. Intentaba resumir mis entradas y me tomó un tiempo realizar los identificadores duplicados. Al colocar el tipo de elemento que quería frente a #, yo era capaz de agarrar el valor del elemento de entrada y deseche el div:

$("input#_myelementid").val(); 

espero que ayude.