Event

event object

(1) 이벤트 객체란 무엇인가요?

　이벤트 객체는 이벤트가 발생하는 요소, 키보드 키 상태, 마우스 위치, 마우스 버튼 상태 등 이벤트의 상태를 나타냅니다. 이벤트는 이벤트가 발생할 때까지 실행되지 않는 함수와 함께 사용되는 경우가 많습니다!

(2)이벤트 관련 메소드 및 속성

　1. Google event.stopPropagation(), IE event.CancelBubble=true: 종료 이벤트는 전파 프로세스의 캡처, 대상 처리 또는 버블링 단계에서 추가로 전파됩니다. 이 메서드를 호출하면 해당 노드의 이벤트 핸들러가 호출되고 해당 이벤트는 더 이상 다른 노드로 전달되지 않습니다

　　2.Google event.preventDefault(), IE event.returnvalue=false: 기본 동작 취소 이벤트의 (태그의 href).

　 3. event.clientX, event.clientY: 브라우저 창의 표시 영역을 기준으로 한 마우스의 X, Y 좌표(창 좌표) 표시 영역에는 도구 모음 및 스크롤 막대가 포함되지 않습니다. IE 이벤트와 표준 이벤트 모두 이 두 가지 속성을 정의합니다

　4.event.offsetX, event.offsetY: 이벤트 소스 요소(이벤트를 트리거한 요소)를 기준으로 한 마우스의 X, Y 좌표입니다. IE 이벤트에만 이 두 가지 속성이 있습니다. 속성. , 표준 이벤트에는 해당 속성이 없습니다. event.offsetLeft, event.offsettop과 동일합니다.

　 5. event.screenX, event.screenY: 사용자 모니터 화면의 왼쪽 상단을 기준으로 한 마우스의 X, Y 좌표입니다. 표준 이벤트와 IE 이벤트 모두 이 두 가지 속성을 정의합니다.

　6. event.keyCode: 키의 코드 값을 가져옵니다. 예: 프로그램에서 어떤 키를 누르는지 어떻게 알 수 있습니까? keyCode를 통해 알 수 있습니다. 프로그래머는 처음부터 키보드의 각 키에 대한 코드를 정의했습니다. 클릭했습니다.

1. 마우스 이벤트는 페이지의 모든 요소에 의해 트리거될 수 있습니다.

click: 사용자가 마우스 버튼을 클릭하거나 Enter 키를 누를 때 트리거됩니다.

input.onclick = function () {
　　alert('Lee');
};

dblclick: 사용자가 기본 마우스 버튼을 두 번 클릭하면 시작됩니다.

input.ondblclick = function () {
　　alert('Lee');
};

mousedown: 사용자가 마우스를 눌렀지만 아직 튕기지 않았을 때 트리거됩니다.

input.onmousedown = function () {
　　alert('Lee');
};

mouseup: 사용자가 마우스 버튼을 놓으면 시작됩니다.

input.onmouseup = function () {
　　alert('Lee');
};

mouseover(mouseenter 메소드는 버블링되지 않음): 마우스가 요소 위로 이동할 때 트리거됩니다.

input.onmouseover = function () {
　　alert('Lee');
};

mouseout(이 mouseleaver 방법은 버블링되지 않음): 마우스가 요소 밖으로 이동할 때 트리거됩니다.

input.onmouseout = function () {
　　alert('Lee');
};

mousemove: 마우스 포인터가 요소 위로 움직일 때 실행됩니다.

input.onmousemove = function () {
　　alert('Lee');
};

2. 키보드 이벤트

keydown: 사용자가 키보드의 아무 키나 누르고 있으면 반복적으로 트리거됩니다.

onkeydown = function () {
　　alert('Lee');
};

keypress: 사용자가 키보드의 문자 키를 누를 때 트리거됩니다. 길게 누르면 반복적으로 트리거됩니다.

onkeypress = function () {
　　alert('Lee');
};

keyup: 사용자가 키보드에서 키를 놓을 때 트리거됩니다.

onkeyup = function () {
　　alert('Lee');
};

3. HTML 이벤트

load: 페이지가 완전히 로드될 때 window에서 트리거되거나 프레임세트가 로드된 후 프레임세트에서 트리거됩니다.

window.onload = function () {
　　alert('Lee');
};

unload: 페이지가 완전히 언로드될 때 window에서 트리거되거나 프레임세트가 언로드된 후 프레임세트에서 트리거됩니다.

window.onunload = function () {
　　alert('Lee');
};

select: 사용자가 텍스트 상자(input 또는 textarea)에서 하나 이상의 문자를 선택할 때 트리거됩니다.

input.onselect = function () {
　　alert('Lee');
};

change: 텍스트 상자 (input 또는 textarea)의 내용이 변경되어 포커스를 잃을 때 트리거됩니다.

input.onchange = function () {
　　alert('Lee');
};

focus: 페이지나 요소에 포커스가 있을 때 window 및 관련 요소에서 트리거됩니다.

input.onfocus = function () {
　　alert('Lee');
};

blur: 페이지나 요소가 포커스를 잃을 때 window 및 관련 요소에서 트리거됩니다.

input.onblur = function () {
　　alert('Lee');
};

submit: 사용자가

form.onsubmit = function () {
　　alert('Lee');
};

form.onreset= function () {
　　alert('Lee');
};

window.onresize = function () {
　　alert('Lee');
};

window.onscroll = function () {
　　alert('Lee');
};