html selected 변경 및 change 실행

html select box의 selected 값을 강제로 스크립트를 통해서 변경해주는 방법

jquery를 이용하면 두 줄이면 충분하다.

<select id="select_id" >
    <option value="10">1010</option>
    <option value="20">2020</option>
    <option value="30">3030</option>
</select>

$("#select_id").val("30").prop("selected", true);

해석 :

html의 id값이 "select_id"를 찾고,

value 값이 "30"인 것을 찾고,

"selected"의 property를 true로 변경한다.

$("#select_id").trigger("change");

해석 :

html의 id값이 "select_id"를 찾아서, "change" 이벤트를 실행시킨다.

이렇게 두 줄을 쓰면, select 값을 변경해주면서, change 이벤트까지 실행시킬 수 있다.

$("#select_id").val("30").prop("selected", true);

$("#select_id").trigger("change");