아랄라랄라
R 스토리
아랄라랄라
전체 방문자
오늘
어제
  • All (197)
    • Web (144)
      • Markup | WEB (9)
      • Styles (45)
      • javascript (32)
      • jquery (28)
      • vue (16)
      • react (10)
      • more (4)
    • IT (31)
      • CS (3)
      • git hub (5)
      • UI | UX (18)
      • more (5)
    • ETC (22)
      • 이슈노트 (12)
      • 스터디 (10)
      • 아랄라 ☞☜ (0)
      • JOB🛠 (0)

인기 글

반응형
hELLO · Designed By 정상우.
아랄라랄라

R 스토리

Web/jquery

[제이쿼리] .on() / .off() / .one()

2018. 5. 15. 14:55

::이벤트다루기::



일반 이벤트 등록 : $대상.on('이벤트이름', 이벤트리스너)


선택된 요소에 하나 이상의 이벤트들을 붙여줍니다.

이벤트 핸들러는 현재 선택된 요소들에만 바인딩됩니다. 그 요소들은 페이지에 반드시 존재해야 .on()함수로 호출할 수 있습니다.


기본행동취소 : 이벤트객체.preventDefault()

버블링 멈추기 : 이벤트객체.stopPropagation()

단축 이벤트 등록 : $대상.단축이벤트(이벤트리스너)



https://jsfiddle.net/Kimara/p0cjwLtc/6/




등록한 이벤트 제거 :


.off() 함수는 .on()함수에 의해 바인딩 된 이벤트 핸들러를 제거합니다.


  1) $대상.off('click',삭제하고싶은 이벤트 리스너 명)

  2) $대상.off('click')

  3) $대상.off()


https://jsfiddle.net/Kimara/p0cjwLtc/8/




이벤트리스너 한번만 사용 : 


$대상.one(이벤트이름, 이벤트리스너)


https://jsfiddle.net/Kimara/p0cjwLtc/9/


버블링활용/하나의 이벤트 : $대상.on('이벤트명','선택자',이벤트리스너)

728x90
저작자표시 비영리

'Web > jquery' 카테고리의 다른 글

[제이쿼리] jQuery UI slider  (0) 2018.05.15
[제이쿼리] .on() 이벤트 종류  (0) 2018.05.15
[제이쿼리] .attr() / .data()  (0) 2018.05.15
[제이쿼리] .attr() .addClass() .removeClass()  (0) 2018.05.15
[제이쿼리] .prepend() .prependTo() .append() .appendTo() .InsertAfter() .after() .InsertBefore() .before()  (0) 2018.05.15

티스토리툴바