Эффективно получить выбранную опцию в раскрывающемся списке (элемент XHTML Select)

Question

Фон

В раскрывающемся списке с использованием элемента Select XHTML имеется большой список опций - десятки.

Используя JavaScript, мне нужно получить выбранную опцию.

Проблема

В настоящее время я использую селектор CSS jQuery :selected, и он работаеткак и ожидалось, но этот подход неэффективен, поскольку для поиска выбранной опции требуется некоторое время - очевидно, это зависит от мощности процессора клиентской машины, но в приличном Intel Core 2 с 4 ГБ ОЗУ наблюдается чрезмерное снижение производительности.

Выпуск

Либо с использованием jQuery, либо с простым JavaScript и DOM, мне нужно эффективно выбрать выбранную опцию этого элемента XHTML Select.

СпасибоВы заранее.

Answer 1

Должно быть просто:

// assuming `select` refers to the select DOM element
var selectedElement = select.options[select.selectedIndex];

См. HTMLSelectElement ^[MDN] .

Обновление:

В более новых браузерах, которые поддерживают следующие методы (они являются частью HTML5 ), вы также можете использовать:

var selectedElement = select.item(select.selectedIndex);
// or
var selectedElement = select[select.selectedIndex];
// or
var selectedElement = select.selectedOptions[0];

Answer 2

var dropDown = document.getElementById("yourId");
dropDown.options[dropDown.selectedIndex];

Answer 3

Используйте "vanilla" DOM ​​selectedIndex свойство <select>.

var $select = $('#mySelect'),
    si = $select.get(0).selectedIndex,
    $selectedOpt = $select.children('option:eq(' + si + ')');

Answer 4

<select id="sel">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>

$("#sel").val()