JQuery получить конкретный текст тега опции

Question

Хорошо, скажите, у меня есть это:

<select id='list'>
    <option value='1'>Option A</option>
    <option value='2'>Option B</option>
    <option value='3'>Option C</option>
</select>

Как бы выглядел селектор, если бы я хотел получить «Вариант B», когда у меня есть значение «2»?

Обратите внимание, что здесь спрашивается не о том, как получить текстовое значение selected , а о любом из них, независимо от того, выбрано оно или нет, в зависимости от атрибута value. Я попробовал:

$("#list[value='2']").text();

Но это не работает.

Answer 1

Если вы хотите получить опцию со значением 2, используйте

$("#list option[value='2']").text();

---

Если вы хотите получить любую выбранную опцию, используйте

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

Answer 2

Он ищет элемент с идентификатором list, который имеет свойство value, равное 2. То, что вы хотите, это option дочерний элемент list.

$("#list option[value='2']").text()

Answer 3

Это отлично сработало для меня, я искал способ отправить два разных значения с параметрами, сгенерированными MySQL, и следующее является универсальным и динамическим:

$(this).find("option:selected").text();

Как уже упоминалось в одном из комментариев. Благодаря этому я смог создать динамическую функцию, которая будет работать со всеми моими полями выбора, для которых я хочу получить оба значения, значение параметра и текст.

Несколько дней назад я заметил, что при обновлении jQuery с 1.6 до 1.9 сайта я использовал этот код, это перестало работать ... вероятно, был конфликт с другим фрагментом кода ... в любом случае, решение было удалить опция вызова find ():

$(this).find(":selected").text();

Это было мое решение ... используйте его, только если у вас возникли проблемы после обновления вашего jQuery.

Answer 4

Исходя из оригинального HTML-кода, опубликованного Paolo, я нашел следующее.

$("#list").change(function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

Он был протестирован для работы в Internet Explorer и Firefox.

Answer 5

1. Если на странице есть только один тег select, вы можете указать select внутри id 'list'

   jQuery("select option[value=2]").text();
   

2. Чтобы получить выделенный текст

   jQuery("select option:selected").text();
   

Answer 6

$("#list option:selected").each(function() {
   alert($(this).text());
});  

для нескольких выбранных значений в элементе #list.

Answer 7

Попробуйте следующее:

$("#list option[value=2]").text();

Причина, по которой ваш оригинальный фрагмент не работал, заключается в том, что ваши теги OPTION являются дочерними по отношению к тегу SELECT, который имеет id list.

Answer 8

Это старый Вопрос, который некоторое время не обновлялся. Правильный способ сделать это сейчас - использовать

$("#action").on('change',function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

Надеюсь, это поможет: -)

Answer 9

$(this).children(":selected").text()

Answer 10

Я хотел получить выбранный ярлык. Это сработало для меня в jQuery 1.5.1.

$("#list :selected").text();