Stel selecteer optie 'selected', in op waarde

Ik heb een select veld met een aantal opties erin. Nu moet ik een van die opties selecteren met jQuery. Maar hoe kan ik dat doen als ik alleen de waarde weet van de optie die geselecteerd moet worden?

Ik heb de volgende HTML:

<div class="id_100">
  <select>
    <option value="val1">Val 1</option>
    <option value="val2">Val 2</option>
    <option value="val3">Val 3</option>
  </select>
</div>

Ik moet de optie met waarde val2 selecteren. Hoe kan dit gedaan worden?

Hier's een demo pagina: http://jsfiddle.net/9Stxb/

Peter Mortensen
Bewerkte vraag 2de5 juli 2016 в 9:37
Programmering
jquery html-select jquery-selectors
12de0 november 2012 в 12:16
13 views

Om een optie met waarde 'val2' te kiezen:

$('.id_100 option[value=val2]').attr('selected','selected');
Peter Mortensen
Bewerkt antwoord 2de5 juli 2016 в 9:35
Commentaren (11)

Deselecteer eerst alles en filter de selecteerbare opties:

$('.id_100 option')
     .removeAttr('selected')
     .filter('[value=val1]')
         .attr('selected', true)
Peter Mortensen
Bewerkt antwoord 25ste5 juni 2016 в 1:25
Commentaren (4)

Je kunt op elk attribuut en zijn waarde selecteren met de attribuutselector [attributennaam=optionalvalue], dus in jouw geval kun je de optie selecteren en het geselecteerde attribuut instellen.

$("div.id_100 > select > option[value=" + value + "]").prop("selected",true);

Waarbij value de waarde is waarop je wilt selecteren.

Als u eerder geselecteerde waarden moet verwijderen, zoals het geval zou zijn als dit meerdere keren wordt gebruikt, moet u het enigszins wijzigen zodat eerst het geselecteerde attribuut wordt verwijderd

$("div.id_100 option:selected").prop("selected",false);
$("div.id_100 option[value=" + value + "]")
        .prop("selected",true);
Peter Mortensen
Bewerkt antwoord 25ste5 juni 2016 в 1:26
Commentaren (0)