Home >
Web Front-end >
JS Tutorial >
Detailed explanation of the usage of window.event event in javascript_Basic knowledge
Detailed explanation of the usage of window.event event in javascript_Basic knowledge
WBOY
Release: 2016-05-16 17:46:56
Original
1197 people have browsed it
When I was writing a program two days ago, I needed to use the window.event event in JavaScript, so I searched the Internet and finally found a good article to share with you: Description Event represents the status of the event, such as the element that triggered the event object, the position and status of the mouse, the key pressed, etc. The event object is only valid during the event. Some attributes of event are only meaningful for specific events. For example, the fromElement and toElement properties are only meaningful for onmouseover and onmouseout events. Example The following example checks whether the mouse is clicked on the link, and, if the shift key is pressed, cancels the link jump.
The following example is displayed on the status bar The current position of the mouse. Copy code The code is as follows:
4.clientX
Description: Returns the X coordinate of the mouse in the client area of the window. Syntax: event.clientX Comments: This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
5.clientY Description: Returns the Y coordinate of the mouse in the client area of the window. Syntax: event.clientY Comments: This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
6.ctrlKey Description: Check the status of ctrl key. Syntax: event.ctrlKey Possible values: The value is TRUE when the ctrl key is pressed, FALSE otherwise. Read only.
7.fromElement Description: Detects the element that the mouse leaves when the onmouseover and onmouseout events occur. Reference: 18.toElement Syntax: event.fromElement Comments: This is a read-only property.
8.keyCode Description: Detects the internal code corresponding to keyboard events. This attribute is used for onkeydown, onkeyup, and onkeypress events. Syntax: event.keyCode[ = keyCode] Possible values: This is a readable and writable value and can be any Unicode keyboard internal code. If no keyboard event was raised, the value is 0 .
9.offsetX Description: Checks the horizontal coordinate of the mouse position relative to the object that triggered the event Syntax: event.offsetX
10.offsetY Description: Checks the vertical coordinate of the mouse position relative to the object that triggered the event Syntax: event.offsetY
11.propertyName Description: Sets or returns the name of the element's changed property. Syntax: event.propertyName [= sProperty] Possible values: sProperty is a string that specifies or returns the name of the property that changed in the event on the element that triggered the event. This property is readable and writable. No default value. Note: You can get the value of propertyName by using the onpropertychange event. Example: The following example uses the onpropertychange event to pop up a dialog box to display the value of propertyName.
<SCRIPT> <br>function changeProp() <br>{ <br>btnProp.value = “This is the new VALUE”; <br>} <br>function changeCSSProp() <br>{ <br>btnStyleProp.style.backgroundColor = “ aqua"; <br>} <br></SCRIPT>
The event object property propertyName is used here to return which property has been altered.
VALUE=”Click to change the VALUE property of this button” onpropertychange='alert(event.propertyName ” property has changed value”)’> onclick=”changeCSSProp()” VALUE=”Click to change the CSS backgroundColor property of this button" onpropertychange='alert(event.propertyName ” property has changed value”)'>
12.returnValue [/code] Description: Set or check the value returned from the event Syntax: event.returnValue[ = Boolean ] Possible values: true The value in the event is returned false The default action of the event on the source object is canceled See the beginning of this article for an example.
13.screenX Description: Detects the horizontal position of the mouse relative to the user's screen Syntax: event.screenX Comments: This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
14.screenY Description: Detects the vertical position of the mouse relative to the user's screen Syntax: event.screenY Comments: This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
15.shiftKey Description: Check the status of the shift key. Syntax: event.shiftKey Possible values: The value is TRUE when the shift key is pressed, FALSE otherwise. Read only.
16.srcElement Description: Returns the element that triggered the event. Read only. See the example at the beginning of this article. Syntax: event.srcElement
17.srcFilter Description: Returns the filter that triggers the onfilterchange event. Read only. Syntax: event.srcFilter
18.toElement Description: Detect the element that the mouse enters when the onmouseover and onmouseout events occur. Reference: 7.fromElement Syntax: event.toElement Comments: This is a read-only property. Example: The following code demonstrates that when the mouse moves over the button, a dialog box pops up and displays "mouse arrived"
Description: Returns the event name. Syntax: event.type Notes: Returns the event name without "on" as the prefix. For example, the type returned by the onclick event is click Read-only.
20. x Description: Returns the x-axis coordinate of the mouse relative to the parent element with the position attribute in the css attribute. If there is no parent element with a position attribute in the css attribute, the BODY element will be used as the reference object by default. Syntax: event.x Comments: If the mouse moves out of the window after the event is triggered, the returned value is -1 This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
21. y Description: Returns the y-axis coordinate of the mouse relative to the parent element with the position attribute in the css attribute. If there is no parent element with a position attribute in the css attribute, the BODY element will be used as the reference object by default. Syntax: event.y Comments: If the mouse moves out of the window after the event is triggered, the returned value is -1 This is a read-only property. This means that you can only use it to get the current position of the mouse, but you cannot use it to change the position of the mouse.
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn