jquery: selector []?

dado un elemento SELECT:jquery: selector []?

<select> 
    <option>foo</option> 
    <option>bar</option> 
    <option>baz</option> 
</select>

deseo seleccionar el elemento OPTION con la "barra" de valor.

Esto no funciona:

$('option[text="bar"]').attr('selected', true);

Sin embargo, esto hace el trabajo:

$('option:[text="bar"]').attr('selected', true);

¿Por qué?

Demostración en directo: http://jsfiddle.net/YbfqZ/2/

Fuente

2011-02-15 Šime Vidas

Recuerde, jQuery ha cambiado en la última versión. Entonces, no cites los atributos ingresados [nombre = tipo_de_guilo]: radio. Solía verse como esta entrada [@ name = "dog_type"]. Hay muchos tutoriales antiguos que todavía tienen comillas y signos @ que ya no funcionan. – Tobias

@Gaspy No, es todo lo contrario. Antes, las citas eran opcionales, ahora son obligatorias. Lo dice en los documentos: http://api.jquery.com/attribute-equals-selector/ –

Bueno, realmente puse mi pie en mi boca. Tuve un problema ayer cuando tomé un código jQuery antiguo y, aunque lo arreglé quitando las comillas. – Tobias

La razón de este comportamiento es que el colon se rompe el selector de querySelectorAll porque no es válido.

Como tal, su valor predeterminado es Sizzle, que tolerará los dos puntos, a pesar de que técnicamente no es compatible (lo que significa que podría romperse en el futuro). Sizzle comprobará los atributos y las propiedades. Como tal, no encontrará un atributo text, pero encontrará la propiedad text del elemento <option>.

Here's an example que demuestra que Sizzle coincidirá con una propiedad en lugar de solo un atributo con su selector attribute-equals.

Código de ejemplo:

// set a custom property on the last option 
$('#id option').slice(-1)[0].customProp = 'customValue'; 

    // breaking the selector with : we default to Sizzle, 
    // which matches our custom property 
$('#id option:[customProp="customValue"]').attr('selected', true);

EDIT:Mi ejemplo enlace de referencia anteriormente de otro ejemplo, ya he escrito el número de revisión equivocado. Fijo.

Fuente

2011-02-15 21:19:52 user113716

+1 - buena respuesta. – jAndy

Sin embargo, ¿por qué jQuery no reconoce el selector sin los dos puntos? Tanto en [CSS2] (http://www.w3.org/TR/CSS2/selector.html#pattern-matching) como en [CSS3] (http://www.w3.org/TR/2001/CR-css3 -selectores-20011113/# selectores), las comillas pertenecen al selector y los dos puntos no. – eykanal

@jAndy: Gracias. Lo gracioso es que * solo * dejé esto como un comentario para [esta respuesta] (http://stackoverflow.com/questions/5009179/jquery-traversing-select-option-text/5009231#5009231), luego vi que Šime lo hizo una pregunta. – user113716

La forma correcta de hacer esto es dar al seleccionar un ID, y dar a los valores de los elementos de opción. Luego puede establecer el valor de la selección.

<select id="theSelect"> 
    <option value="foo">foo</option> 
    <option value="bar">bar</option> 
    <option value="baz">baz</option> 
</select>

Y la JS se vería así

$('#theSelect').val('foo');

Demostración en vivo http://jsfiddle.net/YbfqZ/4/

Fuente

2011-02-15 21:19:33 Dutchie432

¿Qué tipo de selector es ': [text =" bar "]'? –

Respuesta

Cuestiones relacionadas