jQuery UI에서 select에 대해 이벤트를 설정하는 것은 

일반적인 onchange를 통해 JavaScript 함수를 호출하는 것과 약간 차이가 있습니다.


일단 예제를 보시죠.


<!-- jQuery and jQuery UI import !!! -->

....

....

<select id="selectExample">

<option>T1</option>

<option>T2</option>

<option>T3</option>

</select>


<script>

   $( "#selectExample" ).selectmenu({

     change: function( event, ui ) {

      alert(this.selectedIndex);

     }

  });

</script>


select는 일반적인 방식과 동일하게 설정해줍니다.


jQuery UI를 적용하면서 select에 change 속성 값으로 함수를 입력함으로써 

select의 변경이 있는 경우에 alert를 통해 몇 번째 option이 선택되었는지 출력하도록 했습니다.


위와 같은 형식은 jQuery UI 홈페이지에 http://api.jqueryui.com/category/widgets/

에 더 자세히 나와있습니다. 

+ Recent posts