What are the js bubbling events?

js bubbling events include click, dblclick, mouseover, mouseout, mousemove, mousedown, mouseup, keydown, keyup, input, change, submit, focus, blur and scroll, etc. Detailed introduction: 1. Click event, which is triggered when the user clicks the mouse button. The click event is triggered on the target element and then bubbles up on the parent element; 2. dblclick and so on.

The operating system for this tutorial: Windows 10 system, DELL G3 computer.

There are many common bubbling events in JavaScript. These events are triggered sequentially in the process of bubbling up from the target element to the parent element after the event is triggered. The following are some common bubbling events:

1. click event: triggered when the user clicks the mouse button (left button, middle button, or right button). The click event fires on the target element and then bubbles up on the parent element.

2. dblclick event: Triggered when the user double-clicks the mouse button (left button, middle button, or right button). The dblclick event fires on the target element and then bubbles up on the parent element.

3. mouseover event: triggered when the mouse pointer enters the target element. The mouseover event fires on the target element and then bubbles up on the parent element.

4. mouseout event: triggered when the mouse pointer leaves the target element. The mouseout event fires on the target element and then bubbles up on the parent element.

5. mousemove event: triggered when the mouse pointer moves on the target element. The mousemove event fires on the target element and then bubbles up on the parent element.

6. mousedown event: triggered when the mouse button is pressed. The mousedown event fires on the target element and then bubbles up on the parent element.

7. mouseup event: triggered when the mouse button is released. The mouseup event fires on the target element and then bubbles up on the parent element.

8. keydown event: triggered when a key on the keyboard is pressed. The keydown event fires on the target element and then bubbles up on the parent element.

9. keyup event: triggered when a key on the keyboard is released. The keyup event fires on the target element and then bubbles up on the parent element.

10. input event: triggered when the value of the target element changes. The input event fires on the target element and then bubbles up on the parent element.

11. Change event: Triggered when the value of the target element changes and loses focus. The change event fires on the target element and then bubbles up on the parent element.

12. submit event: triggered when the form is submitted. The submit event fires on the target element and then bubbles up on the parent element.

13. focus event: triggered when the target element gains focus. The focus event fires on the target element and then bubbles up on the parent element.

14. blur event: triggered when the target element loses focus. The blur event fires on the target element and then bubbles up on the parent element.

15. scroll event: triggered when the scroll bar of the target element scrolls. The scroll event fires on the target element and then bubbles up on the parent element.

These are just some common examples of bubbling events, there are actually many other events that also fire on the target element and bubble up on the parent element. When writing JavaScript code, understanding these bubbling events can help us better understand and handle the process of event propagation.

The above is the detailed content of What are the js bubbling events?. For more information, please follow other related articles on the PHP Chinese website!