jQuery 이벤트

(2017-06-24)
정보기술(IT) 1. 정보기술

전산기초
컴퓨터구조
프로그래밍
데이터베이스
소프트웨어 공학
운영체제
정보보호/보안
IT 기타기술
 > 프로그래밍프로그래밍 언어론
객체지향
자료구조
알고리즘
자료표현(알파벳/코드)
시스템 프로그래밍
프로그래밍언어 종류
프로그래밍 기타일반
 > 프로그래밍언어 종류 1. 프로그래밍 언어
2. 기계어,어셈블리언어

C/C++
자바(Java)
자바스크립트
 > 자바스크립트 1. JavaScript
2. JS 객체
3. JS 변수,타입
4. JS 함수
5. JS 배열

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

     
1. jQuery 이벤트 관련                                      ☞ 자바스크립트 이벤트 종류 참조

  ㅇ 문서 로딩
     - ready() : 문서 로딩 (이미지,동영상 등이 아닌 단지 html 문서 만 불러왔음을 알림)
     - load()  : 파일 로딩 (네트워크를 통해 해당 문서의 모든 리소스를 불러왔음을 알림)

  ㅇ 브라우저 이벤트
     - 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 화면 효과  

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