عادةً ما أستخدم $("#id").val()
لإرجاع قيمة الخيار المحدد ، لكن هذه المرة لا تعمل. العلامة المحددة لها معرف aioConceptName
كود html
<label>Name</label>
<input type="text" name="name" />
<select id="aioConceptName">
<option>choose io</option>
<option>roma</option>
<option>totti</option>
</select>
بالنسبة للخيارات المنسدلة ، ربما تريد شيئًا كهذا:
var conceptName = $('#aioConceptName').find(":selected").text();
سبب val()
لا يقوم بالخدعة هو أن النقر فوق أحد الخيارات لا يغير قيمة القائمة المنسدلة - إنه يضيف فقط خاصية :selected
إلى الخيار المحدد وهو تابع من القائمة المنسدلة.
قم بتعيين القيم لكل خيار من الخيارات
<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();
اتمنى ان يساعد ..