2010-07-14 20 views

risposta

124

jQuery .val()

var foo = $('#multiple').val(); 
+59

Divertente guardare indietro a queste vecchie domande e vedere la risposta sbagliata scelta tante volte. Chiaramente questo non sta ottenendo i 'valori' come l'OP stava chiedendo come la risposta 'corretta' sotto. – Tomas

+7

IDE come PyCharm ora stanno riprendendo un utilizzo come questo, mostrando avvertimenti come "Uso inefficiente di JQuery", che è quello che mi ha spinto a scorrere oltre questa risposta. : o) –

+0

Non è necessario creare nuovamente un oggetto JQuery all'interno della funzione, è inutile perché è possibile utilizzare puro javascript. Basta fare 'foo [i] = selected.value;' –

263

Usando la funzione .val() in un elenco di selezione multipla restituirà una matrice dei valori selezionati:

var selectedValues = $('#multipleSelect').val(); 

e nel tuo html:

<select id="multipleSelect" multiple="multiple"> 
    <option value="1">Text 1</option> 
    <option value="2">Text 2</option> 
    <option value="3">Text 3</option> 
</select> 
+11

cosa succede se u vuole ottenere 'Testo 1' al posto del valore? sostituire '.val()' con '.text()'? –

+8

Vale la pena notare che una selezione multipla con nulla selezionato restituisce 'null' piuttosto che una matrice vuota. Questo significa che se stai programmando _adding_ un valore selezionato, hai un po 'di giocoleria da fare per farlo bene. – Leo

+0

Grazie! Ci sono tanti modi per ottenere un valore da un elemento con jQuery che è inevitabilmente una lotta per trovare il modo che stai cercando. –

8

Puoi anche utilizzare la funzione js map:

$("#multipleSelect :selected").map(function(i, el) { 
    return $(el).val(); 
}); 

E allora si può ottenere qualsiasi proprietà dell'elemento option:

return $(el).text(); 
return $(el).data("mydata"); 
return $(el).prop("disabled"); 
etc... 
+2

ottima risposta, ma non c'è bisogno di pagare la spesa extra di avvolgere 'el' come un oggetto jQuery per ogni singola opzione. Basta andare direttamente dal DOM quando non è troppo strano. Puoi cambiare '$ (el) .val()' in 'el.value'. Ovviamente se sei abituato a jQuery o vuoi prendere dati o attributi come gli altri tuoi esempi, jQuery non fa male a nessuno. – KyleMit

+1

@KyleMit Ottimo consiglio. Ho appena usato questo approccio per afferrare una collezione di valori di campo nascosti e ha funzionato perfettamente. – EvilDr

4
var selected=[]; 
$('#multipleSelect :selected').each(function(){ 
    selected[$(this).val()]=$(this).text(); 
    }); 
console.log(selected); 

Ancora un altro approccio per questo problema. L'array selezionato avrà gli indici come valori di opzione e ogni elemento dell'array avrà il testo come valore.

per esempio

<select id="multipleSelect" multiple="multiple"> 
    <option value="abc">Text 1</option> 
    <option value="def">Text 2</option> 
    <option value="ghi">Text 3</option> 
</select> 

se dire opzione 1 e 2 sono selezionate.

la matrice selezionata sarà:

selected['abc']=1; 
selected['def']=2. 
2

codice HTML:

<select id="multiple" multiple="multiple" name="multiple"> 
    <option value=""> -- Select -- </option> 
    <option value="1">Opt1</option> 
    <option value="2">Opt2</option> 
    <option value="3">Opt3</option> 
    <option value="4">Opt4</option> 
    <option value="5">Opt5</option> 
</select> 

codice jQuery:

$('#multiple :selected').each(function(i, sel){ 
    alert($(sel).val()); 

}); 

spero che funziona

+7

Non "spero che funzioni", se non sei sicuro che sia la risposta, provalo e sii sicuro! –

+4

Se non si è sicuri della risposta, non pubblicarla .. !! non siamo qui per le speranze .. !! LOL –

+2

Hey Man. Funziona perfettamente. Controlla. Dovresti sperarlo. Non dare un commento irrilevante .. – Prabhagaran

0

ottenere i valori selezionati in virgola come separatore

var Accessids = ""; 
$(".multi_select .btn-group>ul>li input:checked").each(function(i,obj) 
{ 
    Accessids=Accessids+$(obj).val()+","; 
}); 
Accessids = Accessids.substring(0,Accessids.length - 1); 
console.log(Accessids); 
0

basta usare questo

$('#multipleSelect').change(function() { 
    var selectedValues = $(this).val(); 
}); 
Problemi correlati