Получить выбранное значение элемента раскрывающегося списка с помощью jQuery - PullRequest
418 голосов
/ 06 мая 2010

Как получить выбранное значение раскрывающегося списка с помощью jQuery?
Я пытался использовать

var value = $('#dropDownId').val();

и

var value = $('select#dropDownId option:selected').val();

, но оба возвращали пустую строку.

Ответы [ 29 ]

793 голосов
/ 06 мая 2010

Для отдельных элементов dom, чтобы выбрать текущее выбранное значение:

$('#dropDownId').val();

Чтобы получить выбранный в данный момент текст:

$('#dropDownId :selected').text();
57 голосов
/ 06 мая 2010
var value = $('#dropDownId:selected').text()

Должно работать нормально, см. Этот пример:

$(document).ready(function(){ 
  $('#button1').click(function(){ 
    alert($('#combo :selected').text());
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="combo">
  <option value="1">Test 1</option>
  <option value="2">Test 2</option>
</select>
<input id="button1" type="button" value="Click!" />
21 голосов
/ 23 декабря 2012

Попробуйте это jQuery,

$("#ddlid option:selected").text();

или этот javascript,

 var selID=document.getElementById("ddlid");
 var text=selID.options[selID.selectedIndex].text;

Если вам нужен доступ к значению, а не к тексту, попробуйте использовать метод val() вместо text().

Проверьте следующие скриптовые ссылки.

Демо1 | Demo2

14 голосов
/ 12 марта 2013

попробуйте

$("#yourDropdown option:selected").text();
12 голосов
/ 09 мая 2014

Я знаю, что это ужасно старый пост, и меня, вероятно, следует выпороть для этого жалкого воскресения, но я подумал, что поделюсь парой ОЧЕНЬ полезных маленьких фрагментов JS, которые я использую в каждом приложении в моем арсенале ...

При наборе:

$("#selector option:selected").val() // or
$("#selector option:selected").text()

стареет, попробуйте добавить эти маленькие плюшки в ваш глобальный *.js файл:

function soval(a) {
    return $('option:selected', a).val();
}
function sotext(a) {
    return $('option:selected', a).text();
}

и просто напишите soval("#selector"); или sotext("#selector"); вместо этого! Добейтесь большего, комбинируя их и возвращая объект, содержащий value и text!

function so(a) {
    my.value = $('option:selected', a).val();
    my.text  = $('option:selected', a).text();
    return my;
}

Это экономит мне кучу драгоценного времени, особенно в тяжелых приложениях!

9 голосов
/ 23 мая 2014

Это предупредит выбранное значение. Код JQuery ...

$(document).ready(function () {

        $("#myDropDown").change(function (event) {
            alert("You have Selected  :: "+$(this).val());
        });
    });

HTML-код ...

<select id="myDropDown">
        <option>Milk</option>
        <option>Egg</option>
        <option>Bread</option>
        <option>Fruits</option>
    </select>
8 голосов
/ 11 октября 2013

Еще один проверенный пример:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    $('#bonus').change(function() {
    alert($("#bonus option:selected").text());
  });  
});
</script>
</head>

<body>
<select id="bonus">
<option value="1">-$5000</option>
<option value="2">-$2500</option>
<option value="3">$0</option>
<option value="4">$1</option>
<option value="5">We really appreciate your work</option>
</select>
</body>
</html>
7 голосов
/ 03 марта 2013

это сделает свое дело

$('#dropDownId').val();
3 голосов
/ 06 мая 2010

Вы указали свой элемент select с идентификатором?

<select id='dropDownId'> ...

Ваше первое утверждение должно работать!

3 голосов
/ 19 января 2016

Для выбранного текста используйте:

value: $('#dropDownId :selected').text();

Для выбранного значения используйте:

value: $('#dropDownId').val();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...