jQuery Açılan Seçeneği Seç

Genellikle $("#id").val()seçilen seçeneğin değerini döndürmek için kullanıyorum , ancak bu sefer çalışmıyor. Seçilen etiketin kimliği varaioConceptName

HTML Kodu

<label>Name</label>
<input type="text" name="name" />
<select id="aioConceptName">
    <option>choose io</option>
    <option>roma</option>
    <option>totti</option>
</select>

Açılır seçenekler için muhtemelen şöyle bir şey istersiniz:

var conceptName = $('#aioConceptName').find(":selected").text();

Bunun nedeni val()hile yapmamaktır, çünkü bir seçeneği tıklamak açılır menünün değerini değiştirmez - sadece :selectedözelliği açılır listenin alt öğesi olan seçilen seçeneğe ekler .

Seçeneklerin her biri için değerleri ayarlayın

<select id="aioConceptName">
    <option value="0">choose io</option>
    <option value="1">roma</option>
    <option value="2">totti</option>
</select>

$('#aioConceptName').val()öznitelik .val()döndürdüğü için çalışmadı value. Düzgün çalışması için valueözniteliklerin her birinde ayarlanması gerekir <option>.

Şimdi başkaları tarafından önerilen $('#aioConceptName').val()tüm bu :selectedvudu yerine arayabilirsiniz .

Bu soruya rastladım ve Elliot BOnneville'in cevabının daha kısa bir versiyonunu geliştirdim:

var conceptName = $('#aioConceptName :selected').text();

veya genel olarak:

$('#id :pseudoclass')

Bu size ekstra bir jQuery çağrısı kazandırır, her şeyi tek çekimde seçer ve daha nettir (benim görüşüme göre).

Bunu değer için deneyin ...

$("select#id_of_select_element option").filter(":selected").val();

ya da metin için bu ...

$("select#id_of_select_element option").filter(":selected").text();

Etkinlik bağlamındaysanız, jQuery'de, aşağıdaki seçenek kullanılarak seçilen seçenek öğesini alabilirsiniz
$(this).find('option:selected'):

$('dropdown_selector').change(function() {
    //Use $option (with the "$") to see that the variable is a jQuery object
    var $option = $(this).find('option:selected');
    //Added with the EDIT
    var value = $option.val();//to get content of "value" attrib
    var text = $option.text();//to get <option>Text</option> content
});

Düzenle

PossessWithin'de belirtildiği gibi Cevabım sadece şu soruya cevap verir: Seçili "Seçenek" nasıl seçilir.

Ardından, seçenek değerini almak için tuşunu kullanın option.val().

Sade eski javascript kullanmayı düşündünüz mü?

var box = document.getElementById('aioConceptName');

conceptName = box.options[box.selectedIndex].text;

Ayrıca bkz. JavaScript ile seçenek metni / değeri alma

$('#aioConceptName option:selected').val();

Bir seçimin değerini (metni değil) okuma:

var status = $("#Status").val();
var status = $("#Status")[0].value;
var status = $('#Status option:selected').val();

Bir seçim nasıl devre dışı bırakılır? her iki varyantta da değer aşağıdakiler kullanılarak değiştirilebilir:

bir

Kullanıcı açılır menü ile etkileşime giremez. Ve başka hangi seçeneklerin olabileceğini bilmiyor.

$('#Status').prop('disabled', true);

B

Kullanıcı açılır menüdeki seçenekleri görebilir, ancak tümü devre dışıdır:

$('#Status option').attr('disabled', true);

Bu durumda, $("#Status").val() yalnızca daha küçük jQuery sürümlerinde çalışır1.9.0 . Diğer tüm varyantlar çalışacaktır.

Devre dışı bırakılmış bir seçimi nasıl güncelleyebilirim?

Arkadaki koddan seçiminizdeki değeri güncelleyebilirsiniz. Yalnızca kullanıcılar için devre dışı bırakılır:

$("#Status").val(2);

Bazı durumlarda olayları tetiklemeniz gerekebilir:

$("#Status").val(2).change();

<select id="form-s" multiple="multiple">
    <option selected>city1</option>
    <option selected value="c2">city2</option>
    <option value="c3">city3</option>
</select>   
<select id="aioConceptName">
    <option value="s1" selected >choose io</option>
    <option value="s2">roma </option>
    <option value="s3">totti</option>
</select>
<select id="test">
    <option value="s4">paloma</option>
    <option value="s5" selected >foo</option>
    <option value="s6">bar</option>
</select>
<script>
$('select').change(function() {
    var a=$(':selected').text(); // "city1city2choose iofoo"
    var b=$(':selected').val();  // "city1" - selects just first query !
    //but..
    var c=$(':selected').map(function(){ // ["city1","city2","choose io","foo"]
        return $(this).text();
    }); 
    var d=$(':selected').map(function(){ // ["city1","c2","s1","s5"]
        return $(this).val();
    });
    console.log(a,b,c,d);
});
</script>

bu sözdizimini kullanmalısınız:

var value = $('#Id :selected').val();

Bu yüzden bu Kodu deneyin:

var values = $('#aioConceptName :selected').val();

Fiddle'da test edebilirsiniz: http://jsfiddle.net/PJT6r/9/

bu yazıda bu cevaba bakınız

JQuery'yi kullanarak bir changeolay eklemeniz ve o işleyicide seçilen değeri veya metni almanız yeterlidir.

Seçili metne ihtiyacınız varsa, lütfen bu kodu kullanın:

$("#aioConceptName").change(function () {
    alert($("#aioConceptName :selected").text())
});

Veya seçilen değere ihtiyacınız varsa, lütfen bu kodu kullanın:

$("#aioConceptName").change(function () {
    alert($("#aioConceptName :selected").attr('value'))
});

jQuery.val()Seçili öğeler için de bu işlevi kullanın :

.Val () yöntemi temel olarak input, select ve textarea gibi form öğelerinin değerlerini almak için kullanılır. Seçim öğeleri durumunda, nullhiçbir seçenek seçilmediğinde geri döner ve en az bir tane olduğunda seçili her bir seçeneğin değerini içeren bir dizi ve multipleöznitelik mevcut olduğundan daha fazla seçim yapmak mümkündür .

$(function() {
  $("#aioConceptName").on("change", function() {
    $("#debug").text($("#aioConceptName").val());
  }).trigger("change");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select id="aioConceptName">
  <option>choose io</option>
  <option>roma</option>
  <option>totti</option>
</select>
<div id="debug"></div>

En iyi cevabı bulan herkes işe yaramıyor.

Kullanmaya çalışmak:

  $( "#aioConceptName option:selected" ).attr("value");

Son projelerde benim için çalışıyor, bu yüzden bakmaya değer.

Sadece bu işe yarar:

var conceptName = $('#aioConceptName').val();

Düz ileri ve oldukça kolay:

Açılır listeniz

<select id="aioConceptName">
    <option>choose io</option>
    <option>roma</option>
    <option>totti</option>
</select>

Seçilen değeri almak için jquery kodu

$('#aioConceptName').change(function() {
    var $option = $(this).find('option:selected');

    //Added with the EDIT
    var value = $option.val(); //returns the value of the selected option.
    var text = $option.text(); //returns the text of the selected option.
});

Bu şekilde hata ayıklamayı deneyebilirsiniz:

console.log($('#aioConceptName option:selected').val())

Seçilen etiketin get değerini almak için :

 $('#id_Of_Parent_Selected_Tag').find(":selected").val();

Ve metin almak istiyorsanız bu kodu kullanın:

 $('#id_Of_Parent_Selected_Tag').find(":selected").text();

Örneğin:

<div id="i_am_parent_of_select_tag">
<select>
        <option value="1">CR7</option>
        <option value="2">MESSI</option>
</select>
</div>


<script>
 $('#i_am_parent_of_select_tag').find(":selected").val();//OUTPUT:1 OR 2
 $('#i_am_parent_of_select_tag').find(":selected").text();//OUTPUT:CR7 OR MESSI
</script>

Metin düğümü yerine 'değer' özniteliğini almak istiyorsanız, bu sizin için işe yarar:

var conceptName = $('#aioConceptName').find(":selected").attr('value');

bunu dene

$(document).ready(function() {

    $("#name option").filter(function() {
        return $(this).val() == $("#firstname").val();
    }).attr('selected', true);

    $("#name").live("change", function() {

        $("#firstname").val($(this).find("option:selected").attr("value"));
    });
});


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<select id="name" name="name"> 
<option value="">Please select...</option> 
<option value="Elvis">Elvis</option> 
<option value="Frank">Frank</option> 
<option value="Jim">Jim</option> 
</select>

<input type="text" id="firstname" name="firstname" value="Elvis" readonly="readonly">

$('nameofDropDownList').prop('selectedIndex', whateverNumberasInt);

DDL'yi dizinleri olan bir dizi olarak düşünün, bir dizin seçiyorsunuz. JS'nizle ayarlamak istediğinizi seçin.

Umarım bu daha iyi anlamaya yardımcı olur ve bunu aşağıda denemeye yardımcı olur,

$('select[id="aioConceptName[]"] option:selected').each(function(key,value){
   options2[$(this).val()] = $(this).text();
   console.log(JSON.stringify(options2));
});

daha fazla ayrıntı için lütfen http://www.drtuts.com/get-value-multi-select-dropdown-without-value-attribute-using-jquery/

Kullanabilirsiniz $("#drpList").val();

aynı class = name ile bir seçim getirmek için bunu yapabilir, bir seçim seçeneğinin seçili olup olmadığını kontrol edebilirsiniz.

var bOK = true;
$('.optKategorien').each(function(index,el){
    if($(el).find(":selected").text() == "") {
        bOK = false;
    }
});

Ben aynı sorunu vardı ve neden benim durumumda çalışmadığını anladım
html sayfası farklı html parçalara ayrıldı ve ben her zaman boş olmasına selectneden olan aynı kimliğini taşıyan başka bir giriş alanı var bulundu Umarım bu, benzer sorunu olan herkes için günü kurtarır.val()

$ ("# id") .val kullanmak için, seçeneğe şöyle bir değer eklemelisiniz:

<label>Name</label>
<input type="text" name="name" />
<select id="aioConceptName">
    <option value="choose">choose io</option>
</select>

başka, kullanabilirsiniz

   $("#aioConceptName").find(':selected').text();

Keşke yardımcı olur.

İşte bu sorunun basit çözümü.

$("select#aioConceptName").change(function () {
           var selectedaioConceptName = $('#aioConceptName').find(":selected").val();;
           console.log(selectedaioConceptName);
        });

Muhtemelen bu tür bir senaryo için en iyi bahis, jQuery'nin şu anda seçili değeri bulmak için değişiklik yöntemini kullanmaktır , şöyle:

$('#aioConceptName').change(function(){

   //get the selected val using jQuery's 'this' method and assign to a var
   var selectedVal = $(this).val();

   //perform the rest of your operations using aforementioned var

});

Bu yöntemi tercih ederim çünkü belirli bir seçim alanında seçilen her seçenek için işlevler gerçekleştirebilirsiniz.

Umarım yardımcı olur!

Genellikle sadece seçilen değeri elde etmekle kalmaz, aynı zamanda bazı eylemler de gerçekleştirmeniz gerekir. Öyleyse neden tüm jQuery sihrinden kaçınmıyor ve seçili değeri eylem çağrısına bir argüman olarak iletmiyorsunuz?

<select onchange="your_action(this.value)">
   <option value='*'>All</option>
   <option ... />
</select>

Tam olarak seçilen seçeneği kullanarak seçebilirsiniz: Aşağıda innerText verilecektir

$("select#aioConceptName > option:selected").text()

Aşağıda ise size değer verecektir.

$("select#aioConceptName > option:selected").val()