


Detailed explanation of the usage of window.event event in javascript_Basic knowledge
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.
< ;TITLE>Cancels Links
The following example is displayed on the status bar The current position of the mouse.
Copy code The code is as follows:

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"
<SCRIPT> <br>function testMouse(oObject) { <br>if(oObject.contains(event.toElement)) { <br>alert(“ mouse arrived"); <br>} <br>} <br></SCRIPT>
:
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.

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics


![Event ID 4660: Object deleted [Fix]](https://img.php.cn/upload/article/000/887/227/168834320512143.png?x-oss-process=image/resize,m_fill,h_207,w_330)
Some of our readers encountered event ID4660. They're often not sure what to do, so we explain it in this guide. Event ID 4660 is usually logged when an object is deleted, so we will also explore some practical ways to fix it on your computer. What is event ID4660? Event ID 4660 is related to objects in Active Directory and will be triggered by any of the following factors: Object Deletion – A security event with Event ID 4660 is logged whenever an object is deleted from Active Directory. Manual changes – Event ID 4660 may be generated when a user or administrator manually changes the permissions of an object. This can happen when changing permission settings, modifying access levels, or adding or removing people or groups

On iPhones running iOS 16 or later, you can display upcoming calendar events directly on the lock screen. Read on to find out how it's done. Thanks to watch face complications, many Apple Watch users are used to being able to glance at their wrist to see the next upcoming calendar event. With the advent of iOS16 and lock screen widgets, you can view the same calendar event information directly on your iPhone without even unlocking the device. The Calendar Lock Screen widget comes in two flavors, allowing you to track the time of the next upcoming event, or use a larger widget that displays event names and their times. To start adding widgets, unlock your iPhone using Face ID or Touch ID, press and hold

When a value is added to the input box, the oninput event occurs. You can try running the following code to understand how to implement oninput events in JavaScript - Example<!DOCTYPEhtml><html> <body> <p>Writebelow:</p> <inputtype="text"

jQuery is a popular JavaScript library that can be used to simplify DOM manipulation, event handling, animation effects, etc. In web development, we often encounter situations where we need to change event binding on select elements. This article will introduce how to use jQuery to bind select element change events, and provide specific code examples. First, we need to create a dropdown menu with options using labels:

Commonly used events in jquery are: 1. Window events; 2. Mouse events, which are events generated when the user moves or clicks the mouse on the document, including mouse clicks, move-in events, move-out events, etc.; 3. Keyboard events, Events are generated every time the user presses or releases a key on the keyboard, including key press events, key release events, etc.; 4. Form events, such as the focus() event will be triggered when an element gains focus, and the focus() event will be triggered when it loses focus. The blur() event is triggered, and the submit() event is triggered when the form is submitted.

How to implement calendar functions and event reminders in PHP projects? Calendar functionality and event reminders are one of the common requirements when developing web applications. Whether it is personal schedule management, team collaboration, or online event scheduling, the calendar function can provide convenient time management and transaction arrangement. Implementing calendar functions and event reminders in PHP projects can be completed through the following steps. Database design First, you need to design a database table to store information about calendar events. A simple design could contain the following fields: id: unique to the event

Methods for building event-based applications in PHP include using the EventSourceAPI to create an event source and using the EventSource object to listen for events on the client side. Send events using Server Sent Events (SSE) and listen for events on the client side using an XMLHttpRequest object. A practical example is to use EventSource to update inventory counts in real time in an e-commerce website. This is achieved on the server side by randomly changing the inventory and sending updates, and the client listens for inventory updates through EventSource and displays them in real time.

In-depth understanding of the close button event in jQuery During the front-end development process, we often encounter situations where we need to implement the close button function, such as closing pop-up windows, closing prompt boxes, etc. When using jQuery, a popular JavaScript library, it becomes extremely simple and convenient to implement the close button event. This article will delve into how to use jQuery to implement close button events, and provide specific code examples to help readers better understand and master this technology. First, we need to understand how to define
