Thursday 15 August 2013

Disable right click using jQuery


  • Often in our development we require to disable right click on page or on some part of the page.
  • The some part could be a control or section of a page. 
  • We can achieve this simply using jQuery.

Watch Live Demo

Disabling righ click on page :

Code :

$(document).ready(function()
                  {
                      $(document).bind("contextmenu",function(e)
                                       {
                                           e.preventDefault();
                                       });
                  });

Demo :



In the above example, we are preventing the context menu to appear on right click by using the preventDefault.
We can also do the same by returning false as shown below :

Code :

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

Demo :

Thus we have disabled the right click using return false trick.


Disabling right click on control :


Code :

$(document).ready(function () {
    $("#disabled").bind("contextmenu", function () {
        return false;
    });
});

Demo :




In the above code, we have disabled the right click on button control. Thus we can disable the context menu on particluar control as well along with entire page.

No comments:

Post a Comment