Селектор selected - выбор элементов, которые выбраны
Селектор :selected
выбирает элементы,
которые выбраны, то есть те, которые имеют атрибут
selected
.
Селектор :selected
работает для элементов с тегом
option
. Он
не работает с чекбоксами
(checkbox
) или
радио переключателями
(radio
),
для них используйте селектор
checked
.
Так как :selected
не относится к CSS спецификации,
то для улучшения производительности в современных
браузерах лучше в начале отфильтровать элементы с
использованием чистого css-селектора, а затем
применить .filter(':selected')
.
Синтаксис
Так мы выбираем элементы с
атрибутом selected
:
$(':selected');
Пример
Давайте, при каждом выборе пункта в выпадающем
списке, отображать его под списком зеленым
цветом. Как вы видите до вашего первого клика
будут отображены пункты, выбранные по умолчанию,
это 'bbb'
и 'ddd'
:
<select name="texts" multiple="multiple">
<option>aaa</option>
<option selected="selected">bbb</option>
<option>ccc</option>
<option selected="selected">ddd</option>
<option>eee</option>
<option>fff</option>
</select>
<div></div>
div {
color: green;
}
$('select')
.change(function() {
let str = '';
$('select option:selected').each(function() {
str += $(this).text() + ' ';
});
$('div').text(str);
}).trigger('change');