jQuery: Seleziona tutti gli elementi 'select' con determinate val()

Question

Qualcuno sa di un modo semplice, usando jQuery, per selezionare tutti gli elementi <select> il cui attributo val() produce un determinato valore?

Sto provando a fare una logica di validazione e vorrei selezionare tutti quegli elementi con un solo selettore, quindi applicare una classe di avvertimento a ciascuno dei loro genitori. Questo so come fare una volta che seleziono tutti gli elementi, ma non ho visto un selettore che gestisce questo caso.

Devo selezionare tutti gli elementi <select> in un selettore, quindi scorrere tra loro e controllare ciascuno dei loro valori? Speravo che ci sarebbe stato un modo più semplice.

Grazie.

Answer 1

Perché non funziona select[value=x]? Innanzitutto perché <select> non ha un attributo value. Non esiste un singolo valore di una casella di selezione: potrebbero non esserci opzioni selezionate (non dovrebbe esserci normalmente, ma può esserci almeno in IE) e, in un <select multiple>, ci può essere un numero qualsiasi di opzioni selezionate.

Anche input[value=x] non funziona, anche se <input>fa avere un attributo value. Bene, funziona, semplicemente non fa quello che pensi. Attribuisce il valore dell'attributo value="..." nell'HTML, non al valore corrente inserito nel modulo. L'attributo value="..." corrisponde effettivamente alla proprietà defaultValue e non a value.

Allo stesso modo, option[value=x][selected] non funziona perché si sta verificando l'attributo <option selected> dalla sorgente HTML (attributo selected ->defaultSelected proprietà) e non la corrente selectedness dell'opzione (selectedproprietà non attribuiscono) - che potrebbe essere cambiato da quando la pagina è stata caricata.

Tranne in IE, che ottiene gli attributi del modulo , selected ecc. Errati.

Salvo (di nuovo): l'esempio di Tesserex possono sembrano al lavoro, e la ragione di ciò è che quello che sta utilizzando un selettore jQuery-specifiche non standard, :has. Ciò causa il fallimento dei metodi nativi querySelectorAll dei browser moderni e, di conseguenza, jQuery torna al proprio motore di selezione (nativo JavaScript, lento). Questo motore di selezione ha un bug in cui confonde le proprietà degli attributi, consentendo a [value=x] di fare ciò che ci si aspettava e non fallire come dovrebbe! (Aggiornamento: probabilmente non è più il caso nelle versioni jQuery più recenti.)

Riepilogo: il controllo dello stato del campo modulo ei selettori non si combinano. Oltre a questi problemi, devi anche preoccuparti di evitare problemi, ad esempio, cosa succede se il valore che vuoi testare contiene virgolette o parentesi quadre?

Quindi, invece, si dovrebbe verificarlo manualmente. Ad esempio, utilizzando un filtro:.

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

(c'è una proprietàvaluein HTML5 e supportate dai browser moderni, che quando si legge ti dà il valore del primo selezionato <option> di jQuery val() è sicuro da usare qui perché fornisce lo stesso metodo per ottenere la prima opzione selezionata anche su browser che non supportano questo.)

Answer 2

Attribute selectors Credo sia quello che stai cercando.

Qualcosa di simile $+('element[attribute="value"]')

Consulta anche:

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

Answer 3

È possibile utilizzare:

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

dove X è il valore rispetto al quale si desidera controllare il valore della select.

Answer 4

Le risposte esistenti non funzionano sui tag selezionati, ma ho trovato qualcosa che lo fa. Richiedi una selezione che ha un'opzione selezionata.

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