'트리거'에 해당되는 글 1건


자바스크립트 트리거를 활용해 셀렉트박스 선택 값 변경


안녕하세요.
고코더 입니다.



자바스크립트로 프론트를 개발할때 특정 조건에 맞쳐 셀렉트 박스를 변경해야 하는 경우가 있습니다.
이때 사용자 대신 셀렉트 박스를 변경하고 싶다면 트리거를 사용하면 됩니다. 

 1.우선 아래 예제를 함께 살펴보겠습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
function triggerChagne(){
    $("#gocoder").val('g').trigger('change');
}
</script>
</head>
<body>
    <select id="gocoder">
        <option value="">셀렉트박스 선택</option>
        <option value="g">Go</option>
        <option value="c">Coder</option>
     </select>
</body>
</html>
cs

 1.해당 파일을 실행하면 화면과 같은 모습이 보입니다. 버튼을 클릭하면

 2.왼쪽 select box 가 변경 됩니다. 
$("#gocoder").val('g').trigger('change');
이 명령어가 해당 value 값을 가진 박스로 선택해주기 때문입니다.
트리거를 활용하면 chage 이벤트로 바인딩 됩니다.


마무리


트리거만 잘사용해도 편합니다.











댓글을 달아 주세요