# Селектор 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');`

## Смотрите также

- метод `filter`,
  который фильтрует элементы в наборе по заданному селектору
- атрибут `selected`
- селектор `checked`,
  который выбирает элементы, которые выбраны, то есть те, которые имеют атрибут `checked`
  или `selected`
- теги `option`
  и `select`

←→
↑