2012-05-18 11 views
75

me escribió un código que, básicamente, selecciona todo elemento input type=text así:Jquery entrada selector [type = text] ')

$('.sys input[type=text]').each(function() {} 

¿Cómo cambio para seleccionar input[type=text] o select?

Respuesta

136

Utilizando un selector CSS normales:

$('.sys input[type=text], .sys select').each(function() {...}) 

Si no te gusta la repetición:

$('.sys').find('input[type=text],select').each(function() {...}) 

O de manera más concisa, pasar en el argumento context:

$('input[type=text],select', '.sys').each(function() {...}) 

Nota: Internamente jQuery convertirá lo anterior a find() equivalente

http://api.jquery.com/jQuery/

Internamente, el contexto de selección se lleva a cabo con el método .find(), por lo que $ ('período', esto) es equivalente a $ (this) .find ('período').

personalmente encuentro la primera alternativa para ser la más legible :), a pesar de su toma

+0

Dado que el 'context form' usa el' find form', el 'find form' es más eficiente que el' context form' (se evita una función de llamada). Esto es válido para casi todos los selectores utilizados.Entonces, IMO el 'formulario de búsqueda' es más eficiente que el' selector de CSS normal', porque ambas partes del selector son relativas al nodo raíz, donde en el 'formulario de búsqueda', solo la parte' .sys' es relativa a it, then 'input [type = text], select' se ejecuta en un conjunto mucho más pequeño de elementos por lo que puede ser más rápido (pero necesita esta necesidad de ser verificado por las pruebas) – pomeh

+0

@pomeh Puedo ver de dónde vienes, pero si la ejecución de una llamada '$' es * importante * para su aplicación, evite usar jQuery por completo :). Esta respuesta trató de responder la pregunta de OP, si se tratara de una cuestión de rendimiento, esta respuesta no estará aquí en primer lugar. Gracias de todos modos por el comentario :), lo agradezco –

+0

mi comentario no fue sobre la llamada perf 'one ', sino sobre todas las llamadas' $ 'presentes en una aplicación. OMI, cuando tienes diferentes formas de hacer lo mismo, trato de elegir siempre el que tenga mejor bc. 'rendimiento lento' ===' usuarios infelices'. Además, podemos ** responder ** a la pregunta de un OP con múltiples respuestas (como lo hizo) y proporcionar ventajas/inconvenientes de cada uno de ellos (como lo hice en el comentario). IMO es importante darse cuenta de por qué todas las respuestas son diferentes, al tiempo que proporciona el mismo resultado. Además, podemos escribir el código JavaScript vainilla que se ejecuta lentamente: 'JavaScript'! ==' performance' – pomeh

6
$('.sys').children('input[type=text], select').each(function() { ... }); 

EDIT: En realidad este código anterior es equivalente al selector niños .sys > input[type=text] si desea que el descendiente de selección (.sys input[type=text]) necesita usar las opciones dadas por @NiftyDude.

Más información:

+0

que escribió 'chilren' en lugar de' children' – pomeh

+0

y lo arreglé –

+0

@NiftyDude gracias. He agregado algunos enlaces de referencia. –

3
$('input[type=text],select', '.sys'); 

para recorrer:

$('input[type=text],select', '.sys').each(function() { 
    // code 
}); 
4

Si tiene varias entradas como texto en un formulario o una mesa que tiene que recorrer, me hizo esto:

var $list = $("#tableOrForm :input[type='text']"); 

$list.each(function(){ 
    // Go on with your code. 
}); 

Lo que hice fue Revisé cada entrada para ver si el tipo está ajustado en "texto", entonces va a agarrar ese elemento y almacenar en la lista jQuery. Luego, iteraría a través de esa lista. Puede establecer una variable temporal para la iteración actual así:

var $currentItem = $(this); 

Esto establecerá el elemento actual de la iteración actual del bucle para cada uno. Entonces puedes hacer lo que quieras con la variable de temperatura.

Espero que esto ayude a cualquiera!