jQuery: Seleccione todos los elementos 'select' con cierto valor val()

Question

¿Alguien sabe de una manera fácil, usando jQuery, seleccionar todos los elementos <select> cuyo atributo val() arroje un cierto valor?

Estoy tratando de hacer un poco de lógica de validación y me gustaría simplemente seleccionar todos esos elementos con un solo selector, luego aplicar una clase de advertencia a cada uno de sus padres. Esto sé cómo hacerlo una vez que selecciono todos los elementos, pero no vi un selector que maneje este caso.

¿Tendré que seleccionar todos los elementos <select> en un selector, y luego recorrerlos y verificar cada uno de sus valores? Esperaba que hubiera una manera más simple.

Gracias.

Answer 1

¿por qué no funciona select[value=x]? Bueno, en primer lugar porque <select> en realidad no tiene un atributo value. No hay un solo valor de un cuadro de selección: puede que no haya opciones seleccionadas (normalmente no debería haber, pero puede haber al menos IE), y, en un <select multiple>, puede haber cualquier número de opciones seleccionadas.

Incluso input[value=x] no funciona, a pesar de que <input> qué tienen un atributo value. Bueno, funciona, simplemente no hace lo que piensas. Obtiene el valor del atributo value="..." en HTML, , no, el valor actual que ha ingresado en el formulario. El atributo value="..." en realidad corresponde a la propiedad defaultValue y no a value.

Del mismo modo, option[value=x][selected] no funciona porque está buscando el atributo <option selected> de la fuente HTML (selected atributo ->defaultSelected propiedad) y no la selectedness actual de la opción (selectedpropiedad no atribuyen) - que podría haber cambiado desde que se cargó la página.

Excepto en IE, que obtiene los atributos de forma value, selected etc. incorrectos.

Salvo (de nuevo): el ejemplo de Tesserex puede parecen a trabajar, y la razón de ello es que de que está utilizando un selector de jQuery específico no estándar, :has. Esto hace que fallen los métodos nativos querySelectorAll de los navegadores modernos y, en consecuencia, jQuery vuelve a su propio motor de selección (JavaScript nativo, lento). Este motor de selección tiene un error en el que confunde las propiedades de los atributos, lo que permite que [value=x] haga lo que usted esperaba, ¡y no falla como debería! (Actualización: probablemente ya no sea el caso en las versiones más recientes de jQuery).

Resumen: la verificación del estado del campo de formulario y los selectores no se mezclan. Además de estos problemas, también debe preocuparse por los problemas de escape, por ejemplo, ¿qué pasa si el valor que desea probar contiene comillas o corchetes?

Por lo tanto, sí, debe verificarlo manualmente. Por ejemplo, usando un filtro:.

$('select').filter(function() { 
    return $(this).val()==='the target value'; 
}).parent().addClass('warning'); 

(No es un valuepropiedad en HTML5 y soportado por los navegadores modernos, que cuando lo lea le da el valor de la primera <option> seleccionado de jQuery val() es seguro de usar aquí porque proporciona el mismo método para obtener la primera opción seleccionada incluso en navegadores que no la admiten).

Answer 2

Attribute selectors Es lo que estás buscando, creo.

Algo así como $+('element[attribute="value"]')

Consulte también:

• *=anywhere
• ^=starts with
• $=ends with
• ~=contains word
• etc.

Answer 3

Se puede utilizar:

$("select[value=X]"); 

donde X es el valor con el que desea comprobar el valor de la selección.

Answer 4

Las respuestas existentes no funcionan en las etiquetas seleccionadas, pero encontré algo que sí funciona. Pida una selección que tenga una opción seleccionada.

$("select:has(option[value=blah]:selected)")