Wie erhalte ich mit jQuery alle Optionen einer Auswahl?

Wie kann ich alle Optionen einer Auswahl über jQuery erhalten, indem ich ihre ID weitergebe?

Ich suche nur nach ihren Werten, nicht nach dem Text.

Verwenden:

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

.each () | jQuery API-Dokumentation

Ich kenne jQuery nicht, aber ich weiß, dass wenn Sie das select-Element erhalten, es ein 'options'-Objekt enthält.

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

$.map ist wahrscheinlich der effizienteste Weg, dies zu tun.

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

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

Sie können Änderungsoptionen hinzufügen, $('#selectBox option:selected')wenn Sie nur die ausgewählten Optionen möchten.

In der ersten Zeile werden alle Kontrollkästchen aktiviert und das jQuery-Element in eine Variable eingefügt. Wir verwenden dann die .mapFunktion von jQuery, um eine Funktion auf jedes der Elemente dieser Variablen anzuwenden. Alles, was wir tun, ist, den Wert jedes Elements zurückzugeben, da dies alles ist, was uns wichtig ist. Da wir sie innerhalb der Kartenfunktion zurückgeben, wird tatsächlich ein Array der Werte wie angefordert erstellt.

Einige Antworten verwenden each, ist aber mapmeiner Meinung nach eine bessere Alternative:

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

mapIn jQuery gibt es (mindestens) zwei Funktionen. Die Antwort von Thomas Petersen verwendet "Utilities / jQuery.map"; Diese Antwort verwendet "Traversing / Map" (und daher einen etwas saubereren Code).

Es hängt davon ab, was Sie mit den Werten machen werden. Wenn Sie beispielsweise die Werte einer Funktion zurückgeben möchten, mapist dies wahrscheinlich die bessere Alternative. Aber wenn Sie die Werte direkt verwenden möchten, möchten Sie wahrscheinlich each.

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

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

Die richtige Methode besteht jedoch darin, die DOM-Eigenschaft des Elements wie folgt festzulegen :

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

Dadurch werden die Optionswerte von #myselectboxin ein schönes, sauberes Array für Sie eingefügt:

// 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();});

Sie können alle Ihre "ausgewählten Werte" anhand des Namens der Kontrollkästchen nehmen und sie in einem durch "," getrennten Stich darstellen.

Eine gute Möglichkeit, dies zu tun, ist die Verwendung von $ .map () von jQuery:

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

alert(selected_val);

Arbeitsbeispiel

Der effizienteste Weg, dies zu tun, ist die Verwendung $.map()

Beispiel:

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

Sie können dafür folgenden Code verwenden:

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

Für Mehrfachauswahloption:

$('#test').val()Gibt eine Liste der ausgewählten Werte zurück. $('#test option').lengthGibt die Gesamtzahl der Optionen zurück (sowohl ausgewählt als auch nicht ausgewählt).

Dies ist ein einfaches Skript mit 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>

Hier ist ein einfaches Beispiel in jquery, um alle Werte, Texte oder Werte des ausgewählten Elements oder den Text des ausgewählten Elements abzurufen

$('#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();

Oder:

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

Um die Ergebnisse zu sehen:

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

Wenn Sie nach allen Optionen mit ausgewähltem Text suchen, funktioniert der folgende Code.

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

Der kurze Weg

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

oder

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;}