В этой записи я покажу вам как можно получить значение выбранного поля в select
с помощью JavaScript или jQuery на своем примере.
HTML структура
Допустим у вас есть следующая HTML структура:
<select id="select-id"> <option value="1">Тест 1</option> <option value="2" selected="selected">Тест 2</option> <option value="3">Тест 3</option> </select>
Как видно из этого примера, option
со значением «2» является выбранным элементом.
Вариант с JavaScript
Если вам нужно получить значение value
, то делайте так:
var e = document.getElementById("select-id"); var value = e.options[e.selectedIndex].value;
В данном случае, значение value
будет «2».
Если вам нужно получить значение текста выбранной опции, тогда делайте так:
var e = document.getElementById("select-id"); var text = e.options[e.selectedIndex].text;
И тогда вы получите «Тест 2», хранящийся внутри text
.
Вариант с jQuery
В jQuery я буду делать точно тоже самое, что я писал в JavaScript, только используя нативный синтаксис этой библиотеки.
Используя тот же пример, я могу получить значение value
следующим образом:
$("#select-id :selected").attr('value');
Если вас интересует текст, то это делается так:
$("#select-id :selected").text();