Valitsin selected

Valitsin :selected valitsee elementit, jotka on valittu, eli ne, joilla on attribuutti selected. Valitsin :selected toimii elementeille, joilla on tagi option. Se ei toimi valintaruutujen (checkbox) tai radiopainikkeiden (radio) kanssa, niille käytä valitsinta checked. Koska :selected ei kuulu CSS-spesifikaatioon, on suorituskyvyn parantamiseksi nykyaikaisissa selaimissa parempi suodattaa elementit aluksi käyttämällä puhdasta css-valitsinta ja sitten soveltaa .filter(':selected').

Syntaksi

Näin valitsemme elementit, joilla on attribuutti selected:

javascript$(':selected');

Esimerkki

Esitetään jokaisen pudotusvalikon kohdan valinnassa se vihreällä värillä listan alla. Kuten näet ennen ensimmäistä napsautustasi esitetään oletusarvoisesti valitut kohdat, ne ovat 'bbb' ja 'ddd':

html<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>

cssdiv {
  color: green;
}

javascript$('select')
  .change(function() {
    let str = '';
    
    $('select option:selected').each(function() {
      str += $(this).text() + ' ';
    });
    
    $('div').text(str);
  }).trigger('change');

Katso myös