jQuery 이벤트

(2017-08-11)
1. jQuery 이벤트 관련                                      ☞ 자바스크립트 이벤트 종류 참조

  ㅇ 문서 로딩 이벤트
     - ready() : 문서 로딩 (이미지,동영상 등이 아닌 단지 html 문서 만 불러왔음을 알림)
     - load()  : 파일 로딩 (네트워크를 통해 해당 문서의 모든 리소스를 불러왔음을 알림)
        . 사용 例) $(document).load();
        . 사용 例) $(선택).load(URL, 익명 함수 또는 콜백 함수);

  ㅇ 브라우저 이벤트
     - resize() : 브라우저 크기조절 이벤트
     - scroll() : 브라우저 스크롤 이벤트

  ㅇ 마우스 이벤트
     - click()      : 해당 요소를 클릭
     - dbclick()    : 해당 요소를 더블 클릭
     - mouseenter() : 마우스 포인터가 해당 요소로 진입
     - mouseleave() : 마우스 포인터가 해당 요소 밖으로 벗어남
     - mouseover()  : 마우스가 해당 요소 위로 움직일 때
     - mouseout()   : 마우스가 해당 요소 밖으로 움직일 때
     - hover()      : 위 둘(mouseover,mouseout)을 동시에 고려함
        . $().hover(f1,f2); // 요소 위에서 f1 실행, 요소 바깥 f2 실행
     - mouseup()    : 마우스 버튼에서 손을 땜
     - mousemove()  : 마우스 포인터가 이동 함
        . 마우스 커서가 해당 요소내를 움직일 때 또는 커서의 위치 확인에 유용함

  ㅇ 키 이벤트
     - keydown()  : 키를 누름
     - keypress() : 키를 누르고 있음
     - keyup()    : 키에서 손을 땜

  ㅇ 폼 이벤트
     - change() : 폼 필드에서 선택 취할 때
     - blur()   : 포커스를 잃을 때
     - focus()  : 포커스를 얻을 때

  ㅇ 기타 
     * 위 이벤트 메소드들에 전달 파라미터를 비워두면, 해당 이벤트를 발생시킴

     - on() 메서드 하나로도 위 대부분의 이벤트 메소드들을 수용 가능
        . 이벤트 메소드명 옆 () 안에, 그 이벤트를 다룰 함수를 전달하게 됨

     - bind()   : 이벤트,이벤트 핸들러,데이터도 함께 연결시켜줌
        . $().bind(이벤트명, 객체 리터럴 등의 데이터, 수행시킬 이벤트 핸들러 이름)
           .. 가운데 데이터는 선택적(없을 수 있음)
     - unbind() : 이벤트 제거


2. jQuery 이벤트 객체자바스크립트 이벤트 객체 참조프로퍼티
     - altKey, attrChange, attrName, bubbles, button, cancelable, charCode, clientX, clientY,
       ctrlKey, currentTarget, detail, eventPhase, fromElement, keyCode, layerX, layerY,
       metaKey, newValue, offsetX, offsetY, originalTarget, pageX, pageY, prevValue,
       relatedNode, relatedTarget, screenX, screenY, shiftKey, srcElement, target, toElement,
       view, wheelDelta, which

  ㅇ 메소드
     - preventDefault(), stopPropagation(), stopImmediatePropagation(),
       isDefaultPrevent(), isPropagationStopped(), isImmediatePropagationStopped()

  ※ 웹브라우저 마다 다르게 구현된 차이점을,
     - jQuery 이벤트 객체에서는 통일되게 다룰 수 있게 함


[jQuery]1. jQuery  2. jQuery 요소 선택법  3. jQuery 활용  4. jQuery 이벤트  5. jQuery 화면 효과  

 
        최근수정     모바일웹     참고문헌