Bind event to right click

Question

How can I trigger some actions with a right click after disabling the browser context menu?

I tried this.,.

$(document).ready(function(){ $(document).bind("contextmenu",function(e){ $('.alert').fadeToggle(); return false; }); }); 

Answer 1

There is no built-in oncontextmenu event handler in jQuery, but you can do something like this:

 $(document).ready(function(){ document.oncontextmenu = function() {return false;}; $(document).mousedown(function(e){ if( e.button == 2 ) { alert('Right mouse button!'); return false; } return true; }); }); 

Basically, I cancel the oncontextmenu event of the DOM element to disable the browser context menu, and then I capture the mousedown event using jQuery, and there you can find out in the event argument which button was pressed.

You can try the above example here .

Answer 2

Function returns too soon. I added a comment to the code below:

 $(document).ready(function(){ $(document).bind("contextmenu",function(e){ return false; $('.alert').fadeToggle(); // this line never gets called }); }); 

Try replacing return false; to the next line.

Answer 3

Just use an event handler. Something like this should work:

 $('.js-my-element').bind('contextmenu', function(e) { e.preventDefault(); alert('The eventhandler will make sure, that the contextmenu dosn't appear.'); }); 

Answer 4

I found this answer here, and I use it like this.

Code from my library:

 $.fn.customContextMenu = function(callBack){ $(this).each(function(){ $(this).bind("contextmenu",function(e){ e.preventDefault(); callBack(); }); }); } 

Code from my script page:

 $("#newmagazine").customContextMenu(function(){ alert("some code"); }); 

Answer 5

 document.oncontextmenu = function() {return false;}; //disable the browser context menu $('selector-name')[0].oncontextmenu = function(){} //set jquery element context menu 

Answer 6

Is contextmenu event?

I would use onmousedown or onclick , then capture the MouseEvent property of the button to determine which button was clicked (0 = left, 1 = middle, 2 = right).

Answer 7

To disable the context menu of the context menu on all images of the page, simply do the following:

 jQuery(document).ready(function(){ // Disable context menu on images by right clicking for(i=0;i<document.images.length;i++) { document.images[i].onmousedown = protect; } }); function protect (e) { //alert('Right mouse button not allowed!'); this.oncontextmenu = function() {return false;}; } 

Answer 8

.contextmenu : -

Try the following

 <div id="wrap">Right click</div> <script> $('#wrap').contextmenu(function() { alert("Right click"); }); </script> 

.mousedown : -

 $('#wrap').mousedown(function(event) { if(event.which == 3){ alert('Right Mouse button pressed.'); } });