Как получить выбранную опцию $ (this) в jQuery?

92

Следующий код работает:

$("#select-id").change(function(){
  var cur_value = $('#select-id option:selected').text();
  . . .
});

Как отредактировать вторую строку, чтобы:

var cur_value = $(this).***option-selected***.text();

Для чего ты используешь ***option-selected***?

B Семь
источник

Ответы:

121

Для выбранного значения: $(this).val()

Если вам нужен выбранный элемент option, $("option:selected", this)

Хорхебг
источник
106
 $(this).find('option:selected').text();
user56reinstatemonica8
источник
Это отлично сработало для меня - я пробовал, $("option:selected", this)как упоминалось выше, но это было проблематично. Я использовал нажатие кнопки, чтобы добавить текст выбранного элемента опции к другому div, но когда я нажал кнопку, он фактически изменил выбранный элемент ... странно. Используйте это.
skwidbreth
53

На мой взгляд, лучший и самый короткий способ для событий onchange в раскрывающемся списке, чтобы получить выбранный вариант:

$('option:selected',this);

чтобы получить атрибут значения:

$('option:selected',this).attr('value');

чтобы поместить показанную часть между тегами:

$('option:selected',this).text();

В вашем образце:

$("#select-id").change(function(){
  var cur_value = $('option:selected',this).text();
});
Angelmedia
источник
Не используйте .context, он устарел, так как jQuery 1.10 - api.jquery.com/category/deprecated/deprecated-1.10
rafx
Да, но вы имеете в виду следующее: api.jquery.com/context $ ("ul", document.body) .context.nodeName, которое я не использую
angelmedia
1
Мне нравится ответ, но почему он лучше?
Себастьен Жикель
13

Это должно работать:

$(this).find('option:selected').text();
Он Shiming
источник
Тот же ответ, что и выше
Хью
1
Отправлено в ту же минуту!
lharby
9

Вы можете использовать findдля поиска выбранной опции, которая является потомком узла (ов), на который указывает текущий объект jQuery:

var cur_value = $(this).find('option:selected').text();

Поскольку это, вероятно, непосредственный ребенок, я бы предложил .childrenвместо этого использовать :

var cur_value = $(this).children('option:selected').text();
Платиновая лазурь
источник
7
var cur_value = $(this).find('option:selected').text();

Поскольку optionон может быть непосредственным дочерним элементом, selectвы также можете использовать:

var cur_value = $(this).children('option:selected').text();

http://api.jquery.com/find/

Томтом
источник
Куда ты option-selectedбез кавычек ...?
Platinum Azure
Когда я писал, это была опечатка. Подправил ответ.
thomthom
find('option:selected')возвращает для меня пустую строку. Какая версия jQuery требуется? Я работаю в 1.6.1. children('option:selected')работает.
B Seven
option:selectedприсутствует с версии
thomthom
0

Лучшая догадка:

var cur_value = $('#select-id').children('option:selected').text();

Мне больше нравятся дети в этом случае, потому что вы знаете, что идете только на одну ветвь вниз по дереву DOM ...

Likwid_T
источник
Возможно, вы действительно имели в виду var cur_value = $ (this) .children ('option: selected'). Text ();
Джо Джонстон
0

Это просто

$(this).val();

Я думаю, что jQuery достаточно умен, чтобы знать, что вам нужно

Эдмунд Аджей
источник