search
HomeWeb Front-endJS TutorialDetailed explanation of js mouse event examples

Detailed explanation of js mouse event examples

Mar 17, 2018 pm 05:08 PM
javascriptExampleDetailed explanation

This article mainly shares with you detailed explanations of js mouse event examples, hoping to help everyone.

General events

HTML: 2 | 3 | 3.2 |Mouse click event, mostly used for mouse clicks within the range controlled by an objectHTML: 2 | 3 | 3.2 |Mouse double-click eventHTML: 2 | 3 | 3.2 |The button on the mouse was pressedHTML: 2 | 3 | 3.2 |Events fired when the mouse is pressed and releasedHTML: 2 | 3 | 3.2 | Event triggered when the mouse moves over the range of an objectHTML: 2 | 3 | 3.2 |Events triggered when the mouse movesHTML: 2 | 3 | 3.2 |Event triggered when the mouse leaves the scope of an objectHTML: 2 | 3 | 3.2 |Event triggered when a key on the keyboard is pressed and released. [Note: There must be a focused object in the page]HTML: 2 | 3 | 3.2 |Event triggered when a key on the keyboard is pressed [Note: There must be a focused object in the page]HTML: 2 | 3 | 3.2 |Browser: Browser:##onErroronLoad 4onMoveonResizeonScrollonStop onUnloadForm related events##EventsonBlurBrowser: IE3 | N2| O3 ##HTML: 2 | 3 | 3.2 |Event triggered when a form is submittedonFinish##onStart IE4 Edit Event##EventonBeforeCopy| N | O##onBeforeEditFocusHTML: 2 | 3 | 3.2 | 4 onBeforePasteHTML: 2 | 3 | 3.2 | 4 onBeforeUpdate##HTML: 2 | 3 | 3.2 | 4 Browser:Notify the target object when the viewer pastes content from the system clipboard HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | OHTML: 2 | 3 | 3.2 | 4 When the current selected content of the page is Events triggered after copyingBrowser: ##onDragonDragDroponDragEndonDragEnteronDragLeaveonDragOver IE5 onDragStart IE4 onDrop IE5 ##onLoseCapture| N | O Browser:##HTML: 2 | 3 | 3.2 | 4 HTML: 2 | 3 | 3.2 | 4 When the data is completed by Events triggered when the data source is transferred to the objectHTML: 2 | 3 | 3.2 | 4 When the data source changesHTML: 2 | 3 | 3.2 | 4 Trigger event when data reception is completedHTML: 2 | 3 | 3.2 | 4 Events triggered when the data source changesHTML: 2 | 3 | 3.2 | 4 Event triggered when all valid data from the sub-data source is readBrowser:##onRowEnteronRowExitonRowsDeleteonRowsInsertedExternal eventEventonAfterPrint IE5 onBeforePrint IE5 onFilterChange IE4 onHelp
Event View Device Support Description
##onClick 4Browser:
IE3 | N2| O3
onDblClick 4Browser:
IE4 | N4| O
onMouseDown 4Browser:
IE4 | N4| O
onMouseUp 4Browser:
IE4 | N4| O
onMouseOver 4 Browser:
IE3 | N2| O3
onMouseMove 4Browser:
IE4 | N4| O
onMouseOut 4Browser:
IE4 | N3| O3
onKeyPress 4Browser:
IE4 | N4| O
onKeyDown 4 Browser:
IE4 | N4| O
onKeyUp 4Browser: IE4 | N4| O Triggered when a key on the keyboard is pressed and released Event [Note: There must be a focused object in the page]
Page related events
Event Browser support Description
##onAbort##HTML: 2 | 3 | 3.2 | 4
IE4 | N3| OImage was interrupted by user while downloading
onBeforeUnloadHTML: 2 | 3 | 3.2 | 4
IE4 | N | OEvent triggered when the content of the current page is about to be changed
HTML: 2 | 3 | 3.2 | 4 Browser: IE4
| N3| OCapture errors that occur on the current page for some reason, such as script errors and external data reference errors
HTML: 2 | 3 | 3.2 | Browser: IE3
| N2| O3 Events triggered when the page is empty and transferred to the browser, including the completion of external file introduction
HTML: 2 | 3 | 3.2 | 4 Browser: IE | N4
| OEvent triggered when the browser window is moved
HTML: 2 | 3 | 3.2 | 4 Browser: IE4
| N4| O Events triggered when the browser window size is changed
HTML: 2 | 3 | 3.2 | 4 Browser: IE4
| N | OEvents triggered when the browser's scroll bar position changes
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the browser's stop button is pressed or the file being downloaded is interrupted
##HTML: 2 | 3 | 3.2 | 4 Browser: IE3
| N2| O3 Event triggered when the current page will be changed
Browser Support Description
HTML: 2 | 3 | 3.2 | 4 Browser: IE3 |
N2| O3 Event triggered when the current element loses focus[ Both mouse and keyboard triggers]
##onChange
HTML: 2 | 3 | 3.2 | 4 Current An event triggered when an element loses focus and the element's content changes [can be triggered by both mouse and keyboard]
onFocus HTML: 2 | 3 | 3.2 | 4
Browser: IE3 | N2 | O3
Event triggered when an element gets focus
onReset HTML: 2 | 3 | 3.2 | 4
Browser: IE4 | N3| O3
Triggered when the RESET attribute in the form is triggered Event
onSubmit 4Browser:
IE3 | N2| O3
Rolling subtitle event
Event Browser support Description
##onBounce##HTML: 2 | 3 | 3.2 | 4 Browser : IE4
| N | OEvent triggered when the content in Marquee moves outside the display range of Marquee
HTML: 2 | 3 | 3.2 | 4 Browser: IE4
| N | OEvent triggered when the Marquee element completes the content that needs to be displayed
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OEvent triggered when the Marquee element starts to display content
Browser support Description
HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O
Event triggered when the currently selected content of the page is about to be copied to the browser's clipboard
##onBeforeCut
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
When part of the page or Event triggered when all content will be removed from the current page [clip] and moved to the viewer's system clipboard
Browser: IE5 | N | O The current element will enter the editing state
Browser: IE5 | N | O Event triggered when content is about to be transferred [pasted] from the viewer's system clipboard to the page
IE5 | N | O
onContextMenu
Event triggered when the browser presses the right button of the mouse to display the menu or when the page menu is triggered by pressing the keyboard keys [Try Add onContentMenu="return false" to the in the page to disable the use of the right mouse button]
##onCopyBrowser:
IE5 | N | O
onCut##HTML: 2 | 3 | 3.2 | 4
IE5 | N | OEvent triggered when the currently selected content on the page is cut
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvents triggered when an object is dragged [activity event]
HTML: 2 | 3 | 3.2 | 4 Browser: IE | N4
| OAn external object is dragged into the current window or frame by the mouse
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the mouse drag ends, that is, the mouse button is released
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the object dragged by the mouse enters its container scope
HTML : 2 | 3 | 3.2 | 4 Browser: IE5
| N | OWhen the object dragged by the mouse leaves the scope of its container Triggered events
##HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OEvent triggered when a dragged object is dragged within the scope of another object container [Activity event]
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OEvent triggered when an object is to be dragged
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | ODuring a drag process, release Events triggered when the mouse button is pressed
HTML: 2 | 3 | 3.2 | 4 Browser : IE5 | N | O
Event triggered when an element loses the selection focus formed by mouse movement
##onPaste
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
Event triggered when content is pasted
onSelect
HTML: 2 | 3 | 3.2 | 4 IE4 | N | O
When text content is selected Event
onSelectStart
Browser: IE4 | N | O Event triggered when text content selection will begin to occur
Data Binding
Event Browser support Description
##onAfterUpdate Browser:
IE4 | N | O
onCellChangeBrowser:
IE5 | N | O
onDataAvailableBrowser:
IE4 | N | O
onDatasetChangedBrowser:
IE4 | N | O
onDatasetCompleteBrowser:
IE4 | N | O
##onErrorUpdateHTML: 2 | 3 | 3.2 | 4
IE4 | N | OWhen the data transfer is canceled using the onBeforeUpdate event trigger, Instead of onAfterUpdate event
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the data of the current data source changes and there is new valid data
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | O Events triggered when the data of the current data source is about to change
HTML : 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the current data record will be deleted
HTML: 2 | 3 | 3.2 | 4 Browser: IE5
| N | OEvent triggered when the current data source is about to insert a new data record
##Browser support Description
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OEvent triggered when the document is printed
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OEvent triggered when the document is about to be printed
HTML: 2 | 3 | 3.2 | 4 Browser:
| N | OTriggered when the filter effect of an object changes Event
HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | OEvent triggered when the browser presses F1 or the browser's help selection
onPropertyChange HTML: 2 | 3 | 3.2 | 4
Browser: IE5 | N | O
Event triggered when one of the properties of the object changes
onReadyStateChange HTML: 2 | 3 | 3.2 | 4
Browser: IE4 | N | O
Triggered when the initialization property value of the object changes

Related recommendations:

Javascript imitates jquery trigger to trigger mouse events instance sharing

Js operation The process of mouse events

What are jQuery mouse events

The above is the detailed content of Detailed explanation of js mouse event examples. For more information, please follow other related articles on the PHP Chinese website!

Statement
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
Is JavaScript Written in C? Examining the EvidenceIs JavaScript Written in C? Examining the EvidenceApr 25, 2025 am 12:15 AM

Yes, the engine core of JavaScript is written in C. 1) The C language provides efficient performance and underlying control, which is suitable for the development of JavaScript engine. 2) Taking the V8 engine as an example, its core is written in C, combining the efficiency and object-oriented characteristics of C. 3) The working principle of the JavaScript engine includes parsing, compiling and execution, and the C language plays a key role in these processes.

JavaScript's Role: Making the Web Interactive and DynamicJavaScript's Role: Making the Web Interactive and DynamicApr 24, 2025 am 12:12 AM

JavaScript is at the heart of modern websites because it enhances the interactivity and dynamicity of web pages. 1) It allows to change content without refreshing the page, 2) manipulate web pages through DOMAPI, 3) support complex interactive effects such as animation and drag-and-drop, 4) optimize performance and best practices to improve user experience.

C   and JavaScript: The Connection ExplainedC and JavaScript: The Connection ExplainedApr 23, 2025 am 12:07 AM

C and JavaScript achieve interoperability through WebAssembly. 1) C code is compiled into WebAssembly module and introduced into JavaScript environment to enhance computing power. 2) In game development, C handles physics engines and graphics rendering, and JavaScript is responsible for game logic and user interface.

From Websites to Apps: The Diverse Applications of JavaScriptFrom Websites to Apps: The Diverse Applications of JavaScriptApr 22, 2025 am 12:02 AM

JavaScript is widely used in websites, mobile applications, desktop applications and server-side programming. 1) In website development, JavaScript operates DOM together with HTML and CSS to achieve dynamic effects and supports frameworks such as jQuery and React. 2) Through ReactNative and Ionic, JavaScript is used to develop cross-platform mobile applications. 3) The Electron framework enables JavaScript to build desktop applications. 4) Node.js allows JavaScript to run on the server side and supports high concurrent requests.

Python vs. JavaScript: Use Cases and Applications ComparedPython vs. JavaScript: Use Cases and Applications ComparedApr 21, 2025 am 12:01 AM

Python is more suitable for data science and automation, while JavaScript is more suitable for front-end and full-stack development. 1. Python performs well in data science and machine learning, using libraries such as NumPy and Pandas for data processing and modeling. 2. Python is concise and efficient in automation and scripting. 3. JavaScript is indispensable in front-end development and is used to build dynamic web pages and single-page applications. 4. JavaScript plays a role in back-end development through Node.js and supports full-stack development.

The Role of C/C   in JavaScript Interpreters and CompilersThe Role of C/C in JavaScript Interpreters and CompilersApr 20, 2025 am 12:01 AM

C and C play a vital role in the JavaScript engine, mainly used to implement interpreters and JIT compilers. 1) C is used to parse JavaScript source code and generate an abstract syntax tree. 2) C is responsible for generating and executing bytecode. 3) C implements the JIT compiler, optimizes and compiles hot-spot code at runtime, and significantly improves the execution efficiency of JavaScript.

JavaScript in Action: Real-World Examples and ProjectsJavaScript in Action: Real-World Examples and ProjectsApr 19, 2025 am 12:13 AM

JavaScript's application in the real world includes front-end and back-end development. 1) Display front-end applications by building a TODO list application, involving DOM operations and event processing. 2) Build RESTfulAPI through Node.js and Express to demonstrate back-end applications.

JavaScript and the Web: Core Functionality and Use CasesJavaScript and the Web: Core Functionality and Use CasesApr 18, 2025 am 12:19 AM

The main uses of JavaScript in web development include client interaction, form verification and asynchronous communication. 1) Dynamic content update and user interaction through DOM operations; 2) Client verification is carried out before the user submits data to improve the user experience; 3) Refreshless communication with the server is achieved through AJAX technology.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

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

Hot Tools

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Powerful PHP integrated development environment

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function

Atom editor mac version download

Atom editor mac version download

The most popular open source editor