일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- Java
- Design Pattern
- JPA
- Push
- 페이스북 번역
- nginx
- 카프카 트랜잭션
- gcm 푸시 번역
- 푸시 번역
- 레디스
- 푸시
- nginx설치
- 웹사이트최적화기법
- GCM 번역
- git
- notification
- kafka
- nginx설정
- 성능
- 자바스크립트
- redis
- php
- NoSQL
- GCM
- 웹사이트 성능
- APNS
- 웹사이트성능
- 카프카
- 디자인패턴
Archives
- Today
- Total
간단한 개발관련 내용
jQuery event binding. 본문
반응형
jQuery event Binding.
어떤 요소들에 이벤트를 등록하는 작업을 binding 이라 합니다. 그렇게 하면 이벤트 리스너는 자바스크립트 해석기에 어떤 함수를 넘겨줘야 할지 알게 됩니다. 두 가지 방법으로 요소에 이벤트를 등록할 수 있습니다.
1. 페이지를 불러올 때는 이런 방법으로 요소에 이벤트를 등록할 수 있습니다.
이런 방법을 단축 mothod 라고 합니다.
$("#myElement").click(function(){
alert($(this).text());
});
2. 이 방법도 첫번째 방법과 마찬가지지만, DOM 요소를 새로 만들었을 때처럼 페이지를 불러온뒤에 추가된 요소에도 이벤트 리스너를 등록할 수 있습니다.
$("#myElement").bind('click', function(){
alert($(this).text());
});
첫 번째 방법은 두 번째 방법의 단축 mothod 지만 DOM 요소가 이미 존재할 때만 쓸 수 있습니다. jQuery 에는 이런 단축 method 가 많아서 코드를 깔끔하게 쓸 수 있습니다. 하지만 단축 method 에는 한계가 있습니다. 클릭할 수 있는 이미지를 추가했거나 대화형 목록에 항목을 추가하는 등 코드로 DOM 요소를 추가했다면 두 번째 방법을 사용해야 합니다.
반응형