javascript_기본지식 중 window.event 이벤트 사용법에 대한 자세한 설명-JS 튜토리얼-php.cn

javascript_기본지식 중 window.event 이벤트 사용법에 대한 자세한 설명

WBOY

풀어 주다： 2016-05-16 17:46:56

원래의

1177명이 탐색했습니다.

이틀 전 프로그램을 작성할 때 JavaScript에서 window.event 이벤트를 사용해야 해서 인터넷을 검색하다가 마침내 좋은 글을 발견하여 여러분과 공유합니다:
설명
Event는 이벤트 객체를 발생시킨 요소, 마우스의 위치와 상태, 누른 키 등 이벤트의 상태를 나타냅니다.
이벤트 대상은 이벤트 기간에만 유효합니다.
이벤트의 일부 속성은 특정 이벤트에만 의미가 있습니다. 예를 들어 fromElement 및 toElement 속성은 onmouseover 및 onmouseout 이벤트에만 의미가 있습니다.
예제 다음 예는 링크에 마우스가 클릭되었는지 확인하고, Shift 키를 누르면 링크 점프를 취소하는 예입니다.

코드 복사 코드는 다음과 같습니다.

 
 HEAD>링크 취소 
 
다음 예가 표시됩니다. 상태 표시줄에 마우스의 현재 위치입니다. 
 코드는 다음과 같습니다. 

4.clientX

설명:
창의 클라이언트 영역에 있는 마우스의 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 입니다.

9.offsetX
설명:
이벤트를 트리거한 개체를 기준으로 마우스 위치의 수평 좌표를 확인합니다.
구문:
event.offsetX

10.offsetY
설명:
이벤트를 트리거한 개체를 기준으로 마우스 위치의 수직 좌표를 확인합니다.
구문:
event.offsetY

11.propertyName
설명:
요소의 변경된 속성 이름을 설정하거나 반환합니다.
구문:
event.propertyName [= sProperty]
가능한 값:
sProperty는 이벤트를 트리거한 요소의 이벤트에서 변경된 속성의 이름을 지정하거나 반환하는 문자열입니다.
이 속성은 읽고 쓸 수 있습니다. 기본값이 없습니다.
참고:
onpropertychange 이벤트를 사용하여 propertyName 값을 가져올 수 있습니다.
예:
다음 예에서는 onpropertychange 이벤트를 사용하여 propertyName 값을 표시하는 대화 상자를 팝업합니다.

코드 복사 코드는 다음과 같습니다.

SCRIPT>
functionchangeProp()
{
btnProp.value = “이것이 새로운 값입니다.”
}
functionchangeCSSProp()
{
btnStyleProp.style. backgroundColor = “ aqua";
}

이벤트 객체 속성 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

17.srcFilter
설명:
onfilterchange 이벤트를 트리거하는 필터를 반환합니다. 읽기 전용입니다.
구문:
event.srcFilter

18.toElement
설명:
onmouseover 및 onmouseout 이벤트가 발생할 때 마우스가 입력하는 요소를 감지합니다. 참조: 7.fromElement
구문:
event.toElement
설명:
이것은 읽기 전용 속성입니다.
예: 다음 코드는 버튼 위로 마우스를 이동하면 대화 상자가 팝업되고 "마우스 도착"이 표시되는 것을 보여줍니다.

코드 복사 코드는 다음과 같습니다.

<SCRIPT> <br>function testMouse(oObject) { <br>if(oObject.contains(event.toElement)) { <br>alert(“ 마우스 도착"); <br>} <br>} <br></SCRIPT>
:

설명:
이벤트 이름을 반환합니다.
구문:
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입니다.
이것은 읽기 전용 속성입니다. 즉, 마우스의 현재 위치를 가져오는 데만 사용할 수 있지만 마우스 위치를 변경하는 데는 사용할 수 없습니다.