Come ottenere tutte le opzioni di una selezione usando jQuery?

Come posso ottenere tutte le opzioni di una selezione tramite jQuery passando il suo ID?

Sto solo cercando di ottenere i loro valori, non il testo.

Uso:

$("#id option").each(function()
{
    // Add $(this).val() to your list
});

.each () | Documentazione API jQuery

Non conosco jQuery, ma so che se ottieni l'elemento select, contiene un oggetto "opzioni".

var myOpts = document.getElementById('yourselect').options;
alert(myOpts[0].value) //=> Value of the first option

$.map è probabilmente il modo più efficace per farlo.

var options = $('#selectBox option');

var values = $.map(options ,function(option) {
    return option.value;
});

È possibile aggiungere opzioni di modifica a $('#selectBox option:selected')se si desidera solo quelle selezionate.

La prima riga seleziona tutte le caselle di controllo e inserisce il loro elemento jQuery in una variabile. Quindi utilizziamo la .mapfunzione di jQuery per applicare una funzione a ciascuno degli elementi di quella variabile; tutto ciò che stiamo facendo è restituire il valore di ogni elemento poiché è tutto ciò a cui teniamo. Poiché li stiamo restituendo all'interno della funzione della mappa, in realtà crea un array di valori esattamente come richiesto.

Alcune risposte usano each, ma mapè un'alternativa migliore qui IMHO:

$("select#example option").map(function() {return $(this).val();}).get();

Ci sono (almeno) due mapfunzioni in jQuery. La risposta di Thomas Petersen utilizza "Utilities / jQuery.map"; questa risposta usa "Traversing / map" (e quindi un codice un po 'più pulito).

Dipende da cosa hai intenzione di fare con i valori. Se, diciamo, vuoi restituire i valori da una funzione, mapè probabilmente l'alternativa migliore. Ma se hai intenzione di usare i valori direttamente, probabilmente vorrai each.

$('select#id').find('option').each(function() {
    alert($(this).val());
});

$("#id option").each(function()
{
    $(this).prop('selected', true);
});

Tuttavia, il modo CORRETTO è impostare la proprietà DOM dell'elemento, in questo modo:

$("#id option").each(function(){
    $(this).attr('selected', true);
});

Questo metterà i valori delle opzioni #myselectboxin una bella matrice pulita per te:

// First, get the elements into a list
var domelts = $('#myselectbox option');

// Next, translate that into an array of just the values
var values = $.map(domelts, function(elt, i) { return $(elt).val();});

Puoi prendere tutti i "valori selezionati" in base al nome delle caselle di controllo e presentarli in una puntura separata da ",".

Un buon modo per farlo è usare $ .map () di jQuery:

var selected_val = $.map($("input[name='d_name']:checked"), function(a)
    {
        return a.value;
    }).join(',');

alert(selected_val);

Esempio funzionante

Il modo più efficiente per farlo è usare $.map()

Esempio:

var values = $.map($('#selectBox option'), function(ele) {
   return ele.value; 
});

È possibile utilizzare il seguente codice per questo:

var assignedRoleId = new Array();
$('#RolesListAssigned option').each(function(){
    assignedRoleId.push(this.value);
});

Per l'opzione di selezione multipla:

$('#test').val()ritorna l'elenco dei valori selezionati. $('#test option').lengthrestituisce il numero totale di opzioni (sia selezionate che non selezionate)

Questo è un semplice script con jQuery:

var items = $("#IDSELECT > option").map(function() {
    var opt = {};
    opt[$(this).val()] = $(this).text();
    return opt;
}).get();
var selectvalues = [];

for(var i = 0; i < items.length; i++) {
    for(key in items[i]) {


        var id = key;
        var text = items[i][key];

        item = {}
        item ["id"] = id;
        item ["text"] = text;

        selectvalues.push(item);

    }
}
console.log(selectvalues);
copy(selectvalues);

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

Ecco un semplice esempio in jquery per ottenere tutti i valori, i testi o il valore dell'elemento selezionato o il testo dell'elemento selezionato

$('#nCS1 > option').each((index, obj) => {
   console.log($(obj).val());
})

printOptionValues = () => {

  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).val());
  })

}

printOptionTexts = () => {
  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).text());
  })
}

printSelectedItemText = () => {
  console.log($('#nCS1 option:selected').text());
}

printSelectedItemValue = () => {
  console.log($('#nCS1 option:selected').val());
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select size="1" id="nCS1" name="nCS1" class="form-control" >
					<option value="22">Australia</option>
          <option value="23">Brunei</option>
          <option value="33">Cambodia</option>
          <option value="32">Canada</option>
          <option value="27">Dubai</option>
          <option value="28">Indonesia</option>
          <option value="25">Malaysia</option>				
</select>
<br/>
<input type='button' onclick='printOptionValues()' value='print option values' />
<br/>
<input type='button' onclick='printOptionTexts()' value='print option texts' />
<br/>
<input type='button' onclick='printSelectedItemText()' value='print selected option text'/>
<br/>
<input type='button' onclick='printSelectedItemValue()' value='print selected option value' />

$("input[type=checkbox][checked]").serializeArray();

O:

$(".some_class[type=checkbox][checked]").serializeArray();

Per vedere i risultati:

alert($("input[type=checkbox][checked]").serializeArray().toSource());

Se stai cercando tutte le opzioni con un po 'di testo selezionato, il codice qui sotto funzionerà.

$('#test').find("select option:contains('B')").filter(":selected");

La via breve

$(() => {
$('#myselect option').each((index, data) => {
    console.log(data.attributes.value.value)
})})

o

export function GetSelectValues(id) {
const mData = document.getElementById(id);
let arry = [];
for (let index = 0; index < mData.children.length; index++) {
    arry.push(mData.children[index].value);
}
return arry;}