JQuery events-mouse events

A mouse event is triggered when you move the mouse cursor or click with any mouse key.
(1): click Event: this event is triggered when you press the left mouse button on an element and release the left mouse button on the same element.
$ ('P'). click (function (){
Alert ('click function is running! ');
});
(2): dbclick event: the dbclick event is triggered after the user completes two consecutive clicks. The double-click speed depends on the operating system settings. Double-click events are not frequently used on pages.
$ ('P'). dbclick (function (){
Alert ('dbclick function is running! ');
});
(3): mousedown event: this event is triggered when you press the mouse key. Unlike the keydown event, this event is only triggered when you press the mouse.
$ ('P'). mousedown (function (){
Alert ('mousedown function is running! ');
});
(4): mouseup event: the mouseup event is triggered when you release the mouse. If you release the same element as the element that you clicked the mouse, the click event is also triggered.
$ ('P'). mouseup (function (){
Alert ('mouseup function is running! ');
}). Click (function (){
Alert ('click function is running too! ');
});
(5): The mouseover event is triggered when you move the cursor from one element to another. You can use the relatedTagrget attribute if you need to know the source element.
(6): The mouseout event is triggered when you move the mouse out of an element. This includes moving the parent element to the child element, or using the keyboard to jump to the element.
(5) and (6) These two events are generally not commonly used, and it is difficult to achieve interaction with users, that is, it is not easy to capture user events.
(7): mouseenter event: the mouseenter event is triggered when the user cursor enters the element.
$ ('P'). mouseenter (function (){
Alert ('mouseenter function is running! ');
});
(8): mouseleaver event: the mouseleaver event is triggered when the user's cursor leaves the element.
$ ('P'). mouseleaver (function (){
Alert ('mouseleaver function is running! ');
});
(7) and (8) are usually used together. In jQuery, the hover function can be used to replace these two functions.
$ ('P'). hover (function (){
Alert ('mouseenter function is running! ');
}, Function (){
Alert ('mouseleaver function is running! ');
});