jquery event mechanism extension plug-in jquery right mouse button event_jquery

Because technology has been advancing slowly recently, and there are no experts to guide me, I have to rely on myself, so I want to imitate WEBQQ to train myself. It’s best to prepare the necessary things before doing it. In fact, jquery's own event mechanism is very complete, including click, double-click, mouse move in, mouse move out, etc. But there is one less thing to do. It's the right mouse click event. Of course, everyone also directly listens to the mouse press event, and then uses if to determine and execute the corresponding function. Causes the effect of a mouse right-click event.

But this is not what I want. What I want seems to be that this event can be the same as other events such as click events. It can be used conveniently without having to judge every time. Here, by writing a jquery plug-in, this method can be used directly using $().rightClick();.

jQuery plug-ins are mainly divided into 3 types

1. Plug-ins that encapsulate object methods

(This type of plug-in encapsulates objects and uses For operating objects obtained through selectors, which is the method needed here)

2. Plug-in that encapsulates global functions

(You can add independent functions to jquery naming space)

3. Selector plug-in

(Although jquery’s selector is already very powerful, you still need to extend some of your favorite selectors)

Others For some knowledge about plug-ins, you can check the relevant information yourself. Let’s start talking directly here.

This is the first plug-in type used. Let’s first analyze the specific writing ideas.

1. After using the right mouse button event, all system right-click menu functions will be disabled

2. After binding the right mouse button event, the mouse press event is actually triggered.

3. Judge through if. If the right button is pressed, the parameter will be executed. This parameter can only be a function. If it is not a right click, it will not be executed.

I believe that by this point, those who are familiar with jquery will understand how to do it.

jquery event mechanism extension, jquery right mouse button event.

Copy code The code is as follows:

/*right mouse button plug-in*/
(function($) {
$.fn.extend({
//Define the right mouse button method and receive a function parameter
"rightClick":function(fn){
//Call this After the method, the system's right-click menu will be disabled
$(document).bind('contextmenu',function(e){
return false;
});
//Bind the mouse to this object Press event
$(this).mousedown(function(e){
//If the right button is pressed, execute the function
if(3 == e.which){
fn ();
}
});
}
});

})(jQuery);

Copy code The code is as follows:

$(document).ready(function(e){
$("body") .rightClick(function()(alert("right-click")));
});

jquery event mechanism extension, jquery mouse right-click event.
The usage method is the same as other events