프로그래밍/Javascript

셀렉트박스(SelectBox) 실행시 값(value) 가져오기

미냐님 2020. 6. 15. 00:10
728x90

onchange() 함수 활용

간단히 onchange 함수를 활용해볼 수 있다.

  • html
<select class="form-control" name="month" id="month" onchange="getMonth()">                                   
  <option value="1">1월</option>
  <option value="2">2월</option>
  <option value="3" >3월</option>
  <option value="4" >4월</option>
  <option value="5" >5월</option>
</select>
  • script
// 제이쿼리를 이용한 방법
$("#month").change(function(){
  let month1 = $(this).val();
  let month2 = $("#month > option:selected").val();

  console.log(month1);
  console.log(month2);
});


// 함수를 만들어 호출하는 방법
function getMonth() {
  let month3 = $("#month > option:selected").val();

  console.log(month3);
}

셀렉트박스(SelectBox) 값(value) 고정시키기

// value값으로 설정
$("#month").val("5").prop("selected", true);


// optipn의 순서값으로 설정
$("#month option:eq(0)").prop("selected", true);
728x90