JQuery kullanarak bir seçimin tüm seçenekleri nasıl elde edilir?

Bir seçimin tüm seçeneklerini kimliğini ileterek jQuery aracılığıyla nasıl edinebilirim?

Ben sadece değerlerini almak için arıyorum, metin değil.

kullanın:

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

.each () | jQuery API Belgeleri

JQuery bilmiyorum, ancak select öğesi alırsanız, bir 'seçenekler' nesne içerdiğini biliyorum.

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

$.map muhtemelen bunu yapmanın en etkili yoludur.

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

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

$('#selectBox option:selected')Yalnızca seçili olanları istiyorsanız değişiklik seçenekleri ekleyebilirsiniz .

İlk satır tüm onay kutularını seçer ve jQuery öğelerini bir değişkene koyar. Daha sonra .mapbu değişkenin öğelerinin her birine bir işlev uygulamak için jQuery işlevini kullanırız; yaptığımız tek şey her bir elementin değerini geri döndürmek. Bunları harita işlevi içinde döndürdüğümüz için, aslında istendiği gibi bir değer dizisi oluşturur.

Bazı cevaplar kullanır each, ancak mapburada daha iyi bir alternatif IMHO:

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

JQuery'de (en az) iki mapişlev vardır. Thomas Petersen'in cevabı "Utilities / jQuery.map" kullanıyor; bu cevap "Geçiş / harita" (ve dolayısıyla biraz daha temiz bir kod) kullanır.

Değerlerle ne yapacağınıza bağlıdır. Diyelim ki, değerleri bir işlevden döndürmek istiyorsanız map, muhtemelen daha iyi bir alternatiftir. Ama eğer değerleri doğrudan kullanacaksanız, muhtemelen istediğiniz each.

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

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

Bununla birlikte, DOĞRU yol, öğenin DOM özelliğini şu şekilde ayarlamaktır:

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

Bu seçenek değerlerini #myselectboxsizin için güzel ve temiz bir diziye koyacaktır :

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

Tüm "seçili değerlerinizi" onay kutularının adıyla alabilir ve bunları "," ile ayrılmış bir sokette sunabilirsiniz.

Bunu yapmanın güzel bir yolu jQuery'nin $ .map () yöntemini kullanmaktır:

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

alert(selected_val);

Çalışma örneği

Bunu yapmanın en etkili yolu $.map()

Misal:

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

Bunun için aşağıdaki kodu kullanabilirsiniz:

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

Çoklu seçim seçeneği için:

$('#test').val()seçilen değerlerin listesini döndürür. $('#test option').lengthtoplam seçenek sayısını döndürür (hem seçili hem de seçili değil)

Bu jQuery ile basit bir Script:

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>

Jquery'de seçilen öğenin tüm değerlerini, metinlerini veya değerini veya seçilen öğenin metnini almak için basit bir örnek

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

Veya:

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

Sonuçları görmek için:

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

Bazı seçili metne sahip tüm seçenekleri arıyorsanız, aşağıdaki kod çalışacaktır.

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

Kısa yol

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

veya

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