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


114
<select>
<option value="test">label </option>
</select>

Значение можно получить с помощью $select.val().

А что насчет label?

Есть ли решение, которое будет работать в IE6?


Вы имеете в виду, как получить значение selected, выделенное значение? какой в ​​вашем случае ярлык?
ant

Этот вопрос следует перефразировать, чтобы он говорил: «Как получить текст опции выбора с помощью jQuery?» и все ссылки на метку следует заменить текстом, чтобы избежать путаницы с атрибутом метки.
Джоэл Дэвис

Ответы:


221

Попробуй это:

$('select option:selected').text();

3
Это не всегда правильно. Отображаемое описание опции также может быть указано с помощью атрибута label (кроме <= IE7). См. W3schools.com/tags/att_option_label.asp#gsc.tab=0 и w3.org/TR/html401/interact/forms.html#h-17.6
Скотт Стаффорд

3
Чтобы получить атрибут метки , это можно использовать: jQuery ('# theid option: selected'). Attr ('label')
Дэвид Балажич

22

Привет, сначала укажите идентификатор для выбора как

<select id=theid>
<option value="test">label </option>
</select>

тогда вы можете вызвать выбранный ярлык так:

jQuery('#theid option:selected').text()

13

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

//returns "GET THIS" when option is selected
$('#selecter :selected').attr('label'); 

Html

<select id="selecter">
<option value="test" label="GET THIS">
Option (also called label)</option>
</select>

6

Чтобы получить метку конкретной опции в раскрывающемся списке, вы можете привязать это -

$('.class_of_dropdown > option[value='value_to_be_searched']').html();

или

$('#id_of_dropdown > option[value='value_to_be_Searched']').html();

3

Я нашел это полезным

$('select[name=users] option:selected').text()

При доступе к селектору с помощью thisключевого слова.

$(this).find('option:selected').text()


2

Попробуй это:

$('select option:selected').prop('label');

Это вытянет отображаемый текст для обоих стилей <option>элементов:

  • <option label="foo"><option> -> "foo"
  • <option>bar<option> -> "bar"

Если labelвнутри элемента есть и атрибут, и текст, он будет использовать labelатрибут, что соответствует поведению браузера.

Для потомков это было протестировано под jQuery 3.1.1.


0
<SELECT id="sel" onmouseover="alert(this.options[1].text);"
<option value=1>my love</option>
<option value=2>for u</option>
</SELECT>


0

В современных браузерах для этого не нужен JQuery. Вместо этого используйте

document.querySelectorAll('option:checked')

Или укажите любой элемент DOM вместо document


Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.