IT world

JQuery event 본문

코딩/JQuery

JQuery event

엄킹 2019. 8. 6. 19:20

event란


- 브라우져에서 일어난 사건을 의미하며 클릭, 마우스 이동, 타이핑, 페이지 로딩등이 해당된다.

- event programming을 한다는 것은 어떠한 이벤트가 발생했을 때 브라우저가 해당 이벤트와 관련된 함수를 실행하여 사용자가 원하는 결

  과를 출력할 수 있도록 하는 것이다.

 

jQuery의 이벤트


- 제이쿼리가 제공하는 이벤트중 중요한 특징 중 하나는 크로스브라우징의 문제를 해결해준다는 점이다.

  • 인터넷 익스플로우나 다른 브라우저들은 서로 이벤트를 설치하는 API의 형식이 다르기 때문에 개발자 입장에서는 해당 브라우저를 확인하기 위해 조건문을 사용하거나 각자 다른 브라우저를 사용하여 테스트하는 불편함이 있었는데 이러한 문제를 해결해준다.

- bind로 이벤트 핸들러를 설치하고 unbind로 제거한다.

 

- trigger로 이벤트 핸들러를 강제로 실행할 수 있다.

  •  이벤트가 마치 발생한 거처럼 이벤트핸들러를 호출 할 수 있다.

- click, ready와 같이 다양한 이벤트 헬퍼를 제공한다.

  •  좀 더 직관적인 프로그래밍을 도와준다.

- live를 이용하면 현재 존재하지 않는 엘리먼트에게도 이벤트 핸들러를 설치할 수 있다.








- click me라는 버튼을 누르면 bind를 통해 이벤트를 설치하고 clickHandler함수를 호출하여 thank you라는 경고창을 출력해 준다.

- trigger라는 버튼을 누르면 현재 bind로 이벤트가 설치된 click me의 결과와 동일한 경고창이 출력된다.

- unbind 버튼을 누르면 click me에 설치된 이벤트를 제거하여 더 이상 경고창이 출력되지 않도록 한다.


- 익명함수를 사용한 이유는 이벤트를 설치할 때의 로직들은 보통 재활용되지 않기 때문에 익명함수를 사용하는 것이 편리하다.




이벤트 헬퍼



- 간결한 코드이기 때문에 좀 더 경제적인 코딩이 가능하다.

- 첫번 째 예제와 다르게 ready라는 메소드를 직접 사용







참고: https://www.youtube.com/watch?v=e-Vuhy_6DsE&list=PLrCCNh6y7w2g6U7RX_v-TOefyRPiO32jT&index=6







'코딩 > JQuery' 카테고리의 다른 글

ajax  (0) 2019.08.08
JQuery chain  (0) 2019.08.06
JQuery wrapper  (0) 2019.08.06
jQuery 소개  (0) 2019.08.06
Comments