Selected-selector

Selectoren :selected velger elementer som er valgt, det vil si de som har attributten selected. Selectoren :selected fungerer for elementer med taggen option. Den fungerer ikke med avkrysningsbokser (checkbox) eller radioknapper (radio), for dem bruker du selectoren checked. Siden :selected ikke tilhører CSS-spesifikasjonen, er det for bedre ytelse i moderne nettlesere å først filtrere elementer med bruk av ren css-selector, og deretter bruke .filter(':selected').

Syntaks

Slik velger vi elementer med attributten selected:

javascript$(':selected');

Eksempel

La oss, for hvert valg av punkt i nedtrekks- listen, vise det under listen i grønn farge. Som du ser vil det før din første klikk vises punkter som er valgt som standard, dette er 'bbb' og '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');

Se også