Jquery 이벤트에 대해서 알아보겠습니다.
1.click() 이벤트
가장 많이 사용하는 click 이벤트입니다.
<div id="click1">1번 div</div>
<div id="click2">2번 div</div>
<div id="click3">3번 div</div>
- jQuery
$(document).ready(function() {
$('#click1').click(function() {
alert("1번 div");
});
$('#click2').click(function() {
alert("2번 div");
});
$('#click3').click(function() {
alert("3번 div");
});
});
# id 선택자 이용하여 click 이벤트가 발생했을 때 알람을 띄우는 간단한 예제를 작성했습니다.
blur 이벤트는 HTML DOM이 포커스를 잃었을 때 발생하는 이벤트입니다.
보통 input DOM에 적용하여 사용합니다.
아이디나 패스워드 입력을 마치고 포커스를 잃었을 때 유효성 검사를 위해 사용하기도 합니다.
<input type="text" id="iptTest"/>
- jQuery
$('#iptTest').blur(function() {
alert("iptTest out");
});
# id 선택자 이용하여 iptTest가 포커스를 잃었을 때 알람을 띄우는 간단한 예제를 작성했습니다.
예제 : 이동
다음시간에는 jquery 코드를 줄이기 위한 자기 자신을 가르키는 요소
this를 이용하는 방법을 알아보겠습니다.
this를 이용하면 반복되는 코드도 줄고 간단하게 기능을 구현할 수 있습니다.
'jQuery' 카테고리의 다른 글
jQuery] val(), text() 값 셋팅, 값 가져오기 setValue, setText (0) | 2015.10.11 |
---|---|
[jQuery] jquery tigger, jquery 함수 실행, 이벤트 실행 (0) | 2015.10.05 |
[jQuery] jquery this, 코드 줄이기, jquery index, 인덱스 (0) | 2015.10.04 |
[jQuery] jquery 클래스 추가(addClass), class 추가 삭제(removeClass) 및 확인(hasClass) (0) | 2015.10.01 |
[jQuery] jquery selector 셀렉터 정리 (0) | 2015.09.30 |