احصل على خيار محدد من القائمة المنسدلة

قم بتعيين القيم لكل خيار من الخيارات

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

$('#aioConceptName').val() لم تنجح لأن .val() ترجع سمة value. لجعله يعمل بشكل صحيح ، يجب تعيين السمات value على كل <option>.

يمكنك الآن الاتصال بـ $('#aioConceptName').val() بدلاً من كل هذا :selected الفودو الذي اقترحه الآخرون.

عثرت على هذا السؤال وقمت بتطوير نسخة أكثر إيجازًا من إجابة Elliot BOnneville:

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

أو بشكل عام:

$('#id :pseudoclass')

هذا يوفر عليك مكالمة jQuery إضافية ، ويحدد كل شيء في طلقة واحدة ، وأكثر وضوحا (رأيي).

جرب هذا لقيمة ...

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

أو هذا للنص ...

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

إذا كنت في سياق الحدث ، في jQuery ، فيمكنك استرداد عنصر الخيار المحدد باستخدام:
$(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
});

تحرير

كما ذكر PossessWithin ، جوابي فقط الإجابة على السؤال: كيفية تحديد "الخيار" المحدد.

بعد ذلك ، للحصول على قيمة الخيار ، استخدم option.val().

هل فكرت في استخدام جافا سكريبت القديم البسيط؟

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

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

راجع أيضًا الحصول على نص خيار/قيمة مع JavaScript

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

قراءة القيمة (وليس النص) لتحديد:

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

كيفية تعطيل اختيار؟ في كلا الخيارين ، يمكن تغيير القيمة باستخدام:

A

لا يمكن للمستخدم التفاعل مع القائمة المنسدلة. وهو لا يعرف الخيارات الأخرى التي قد توجد.

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

B

يمكن للمستخدم رؤية الخيارات في القائمة المنسدلة ولكن تم تعطيلها جميعًا:

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

في هذه الحالة ، ستعمل $("#Status").val() فقط لإصدارات jQuery الأصغر من 1.9.0. جميع المتغيرات الأخرى ستعمل.

كيفية تحديث اختيار المعوقين؟

من التعليمات البرمجية خلف يمكنك الاستمرار في تحديث القيمة في تحديد الخاص بك. تم تعطيله فقط للمستخدمين:

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

في بعض الحالات ، قد تحتاج إلى إطلاق الأحداث:

$("#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>

استخدم jQuery.val() الدالة لعناصر تحديد ، أيضًا:

يتم استخدام طريقة .val () بشكل أساسي للحصول على قيم عناصر النموذج مثل الإدخال ، التحديد و textarea. في حالة عناصر التحديد ، تقوم بإرجاع null عند عدم تحديد أي خيار وصفيف يحتوي على قيمة كل خيار محدد عندما يكون هناك خيار واحد على الأقل ويمكن تحديد أكثر لأن سمة multiple موجودة.

$(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>

يجب عليك استخدام بناء الجملة هذا:

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

لذا جرب هذا الكود:

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

يمكنك اختبار في Fiddle: http://jsfiddle.net/PJT6r/9/

انظر حول هذه الإجابة في هذا المنصب

باستخدام jQuery ، فقط أضف حدث change واحصل على قيمة أو نص محدد داخل هذا المعالج.

إذا كنت بحاجة إلى نص محدد ، يرجى استخدام هذا الرمز:

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

أو إذا كنت بحاجة إلى قيمة محددة ، فيرجى استخدام هذا الرمز:

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

لكل من اكتشف أن أفضل إجابة لا يعمل.

حاول استخدام:

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

يعمل لي في المشاريع الحديثة لذلك يجدر النظر فيه.

فقط هذا يجب أن تعمل:

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

يمكنك محاولة تصحيحها بهذه الطريقة:

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

آمل أن يساعد هذا أيضًا في فهم أفضل ويساعد في تجربة ذلك أدناه ، $('select[id="aioConceptName[]"] option:selected').each(function(key,value){ options2[$(this).val()] = $(this).text(); console.log(JSON.stringify(options2)); });
لمزيد من التفاصيل يرجى http://www.drtuts.com/get-value-multi-select-dropdown-without-value-attribute-using-jquery/

محاولة لهذا واحد

$(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">

على التوالي إلى الأمام وسهلة جدا:

القائمة المنسدلة الخاصة بك

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

كود Jquery للحصول على القيمة المحددة

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

إذا كنت ترغب في الحصول على السمة "value" بدلاً من العقدة النصية ، فسيكون ذلك مناسبًا لك:

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

عادة ما لا تحتاج فقط إلى الحصول على القيمة المحددة ، ولكن أيضًا تنفيذ بعض الإجراءات. فلماذا لا تتجنب كل سحر jQuery وتمرير القيمة المحددة كوسيطة لدعوة الإجراء؟

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

يمكنك استخدام $("#drpList").val();

يمكنك تحديد استخدام الخيار المحدد بالضبط: أدناه سوف تعطي innerText

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

بينما أدناه سوف تعطيك قيمة.

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

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

تخيل DDL كصفيف به فهارس ، فأنت تختار فهرسًا واحدًا. اختيار واحد الذي تريد ضبطه على مع JS الخاص بك.

للحصول على قيمة من العلامة المحددة:

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

وإذا كنت ترغب في الحصول على نص استخدم هذا الرمز:

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

على سبيل المثال => لدي هذه العلامة المحددة:

<div id="id_Of_Parent_Selected_Tag">
<select >
        <option value="1">CR7</option>
        <option value="2">MESSI</option>
    </select>
</div>
<script>
 $('#id_Of_Parent_Selected_Tag').find(":selected").val();//OUTPUT:1 OR 2
 $('#id_Of_Parent_Selected_Tag').find(":selected").text();//OUTPUT:CR7 OR MESSI
</script>

كان لدي نفس المشكلة ووجدت لماذا لم تكن تعمل على حالتي
تم تقسيم صفحة html إلى أجزاء html مختلفة ووجدت أن لدي حقل إدخال آخر يحمل نفس معرف select ، مما تسبب في أن val() فارغ دائمًا
آمل أن يوفر هذا اليوم لأي شخص لديه مشكلة مماثلة.

لإحضار تحديد بنفس الفئة = اسم يمكنك القيام بذلك ، للتحقق مما إذا كان خيار تحديد محددًا أم لا.

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

لاستخدام $ ("# id"). val ، يجب عليك إضافة قيمة إلى الخيار مثل هذا:

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

آخر ، يمكنك استخدام

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

اتمنى ان يساعد ..