집 >
웹 프론트엔드 >
JS 튜토리얼 >
javascript_기본지식 중 window.event 이벤트 사용법에 대한 자세한 설명
javascript_기본지식 중 window.event 이벤트 사용법에 대한 자세한 설명
WBOY
풀어 주다: 2016-05-16 17:46:56
원래의
1196명이 탐색했습니다.
이틀 전 프로그램을 작성할 때 JavaScript에서 window.event 이벤트를 사용해야 해서 인터넷을 검색하다가 마침내 좋은 글을 발견하여 여러분과 공유합니다: 설명 Event는 이벤트 객체를 발생시킨 요소, 마우스의 위치와 상태, 누른 키 등 이벤트의 상태를 나타냅니다. 이벤트 대상은 이벤트 기간에만 유효합니다. 이벤트의 일부 속성은 특정 이벤트에만 의미가 있습니다. 예를 들어 fromElement 및 toElement 속성은 onmouseover 및 onmouseout 이벤트에만 의미가 있습니다. 예제 다음 예는 링크에 마우스가 클릭되었는지 확인하고, Shift 키를 누르면 링크 점프를 취소하는 예입니다.
설명: 창의 클라이언트 영역에 있는 마우스의 X 좌표를 반환합니다. 구문: event.clientX 설명: 이것은 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.
5.clientY 설명: 창의 클라이언트 영역에서 마우스의 Y 좌표를 반환합니다. 구문: event.clientY 설명: 이것은 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.
6.ctrlKey 설명: Ctrl 키의 상태를 확인합니다. 구문: event.ctrlKey 가능한 값: Ctrl 키를 누르면 값이 TRUE이고, 그렇지 않으면 FALSE입니다. 읽기 전용입니다.
7.fromElement 설명: onmouseover 및 onmouseout 이벤트가 발생할 때 마우스가 떠나는 요소를 감지합니다. 참조: 18.toElement 구문: event.fromElement 설명: 이것은 읽기 전용 속성입니다.
8.keyCode 설명: 키보드 이벤트에 해당하는 내부 코드를 감지합니다. 이 속성은 onkeydown, onkeyup 및 onkeypress 이벤트에 사용됩니다. 구문: event.keyCode[ = keyCode] 가능한 값: 읽고 쓸 수 있는 값이며 모든 유니코드 키보드 내부 코드일 수 있습니다. 키보드 이벤트가 발생하지 않은 경우 값은 0 입니다.
10.offsetY 설명: 이벤트를 트리거한 개체를 기준으로 마우스 위치의 수직 좌표를 확인합니다. 구문: event.offsetY
11.propertyName 설명: 요소의 변경된 속성 이름을 설정하거나 반환합니다. 구문: event.propertyName [= sProperty] 가능한 값: sProperty는 이벤트를 트리거한 요소의 이벤트에서 변경된 속성의 이름을 지정하거나 반환하는 문자열입니다. 이 속성은 읽고 쓸 수 있습니다. 기본값이 없습니다. 참고: onpropertychange 이벤트를 사용하여 propertyName 값을 가져올 수 있습니다. 예: 다음 예에서는 onpropertychange 이벤트를 사용하여 propertyName 값을 표시하는 대화 상자를 팝업합니다.
이벤트 객체 속성 propertyName이 사용됩니다. 변경된 속성을 반환하려면 여기를 클릭하세요. VALUE=”이 속성의 VALUE 속성을 변경하려면 클릭하세요. 버튼” onpropertychange='alert(event.propertyName ” 속성 값이 변경되었습니다.”)'> onclick=”changeCSSProp()” VALUE= ”이 버튼의 CSS backgroundColor 속성을 변경하려면 클릭하세요." onpropertychange='alert(event.propertyName ” 속성 값이 변경되었습니다.”)'>
12.returnValue [/code] 설명: 이벤트에서 반환된 값을 설정 또는 확인 구문: event.returnValue[ = Boolean ] 가능한 값: true 이벤트의 값이 반환됩니다. false 소스 개체에 대한 이벤트의 기본 작업이 취소됩니다. 예시는 이 문서의 시작 부분을 참조하세요.
13.screenX 설명: 사용자 화면을 기준으로 마우스의 수평 위치를 감지합니다. 구문: event.screenX 댓글 : 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.
14.screenY 설명: 사용자 화면을 기준으로 마우스의 수직 위치를 감지합니다. 구문: event.screenY 댓글 : 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.
15.shiftKey 설명: Shift 키의 상태를 확인하세요. 구문: event.shiftKey 가능한 값: Shift 키를 누르면 값이 TRUE이고, 그렇지 않으면 FALSE입니다. 읽기 전용입니다.
16.srcElement 설명: 이벤트를 트리거한 요소를 반환합니다. 읽기 전용입니다. 이 글의 시작 부분에 있는 예시를 참조하세요. 구문: event.srcElement
18.toElement 설명: onmouseover 및 onmouseout 이벤트가 발생할 때 마우스가 입력하는 요소를 감지합니다. 참조: 7.fromElement 구문: event.toElement 설명: 이것은 읽기 전용 속성입니다. 예: 다음 코드는 버튼 위로 마우스를 이동하면 대화 상자가 팝업되고 "마우스 도착"이 표시되는 것을 보여줍니다.
설명: 이벤트 이름을 반환합니다. 구문: event.type 참고: "on"을 접두어로 사용하지 않고 이벤트 이름을 반환합니다. 예를 들어 onclick 이벤트에서 반환된 유형은 읽기 전용입니다.
20.x 설명: css 속성에 position 속성이 있는 상위 요소를 기준으로 마우스의 x축 좌표를 반환합니다. css 속성에 position 속성을 가진 상위 요소가 없으면 기본적으로 BODY 요소가 참조 개체로 사용됩니다. 구문: event.x 설명: 이벤트가 발생한 후 마우스가 창 밖으로 이동하면 반환되는 값은 -1입니다. 이것은 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.
21.y 설명: css 속성에 position 속성을 사용하여 상위 요소를 기준으로 마우스의 y축 좌표를 반환합니다. css 속성에 position 속성을 가진 상위 요소가 없으면 기본적으로 BODY 요소가 참조 개체로 사용됩니다. 구문: event.y 설명: 이벤트가 발생한 후 마우스가 창 밖으로 이동하면 반환 값은 -1입니다. 이것은 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.