Disable right click using jquery

Disable right click

With the given code you can simply disable right click on hole of the page. However you can also disable right click on particular element.

$(document).bind('contextmenu', function (e) {
  e.preventDefault();
  alert('Right Click is not allowed');
});

Though disabling right click with any code not is complete solution to save the data, there are many tool to get your image or source code, but it will make task difficult for normal user.

CODE
<!DOCTYPE html>
<html>
<head>
  <title>jQuery With Example</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $(document).bind('contextmenu', function (e) {
        e.preventDefault();
        alert('Right Click is not allowed');
      });

      /*$('.Container').bind('contextmenu',function(e){
      e.preventDefault();
      alert('Right Click is not allowed on div');
      });*/
    });
  </script>
</head>
<body>
  <div class="Container" style="border:1px solid Red; width:300px;">
    <p>Please right Click here for test this example</p>
    <input type="text" /><br>
    <input type="checkbox" />
  </div>
  <button id="btnClick">Click</button>
</body>
</html>
DISPLAY

Please right Click here for test this example


26 comments :

  1. Thnaks, this worked perfectly!!

    ReplyDelete
  2. Hi,it works on all the controls other than iframes:(
    i am unable to find any fix for this issue. Please help!

    ReplyDelete
    Replies
    1. Hi Junaid

      It is not possible if it's on an external domain. But it is possible if the page inside an iframe is on the same domain.
      Please view demo on given below link
      http://jsfiddle.net/nirbhaysingh/F2uVB/

      Delete
  3. If we click on Checkbox after second click then it is not working so it is not helpful to use.

    ReplyDelete
    Replies
    1. Hi Imtiyaz,

      After your comment I have also include a checkbox in this example and it is working fine and you can see you are not able to right click on even checkbox.

      Delete
  4. All of your posts are so relevant and needful ..Please provide some tutorial on dynamically fill create or load forms and also creating image dynamically on a particular events thanks.

    ReplyDelete
  5. Nice Example....
    Thanks... :)

    ReplyDelete
  6. i want to disable right click on iframe

    ReplyDelete
  7. I want to disable the right click on div not for whole page the syntax that you given is not working or please give me any link of example thanks

    ReplyDelete
    Replies
    1. Hi Rajendra,
      Its working, however I am giving you a link. Please check it.

      http://jsfiddle.net/nirbhaysingh/pLcam40h/

      Delete
    2. Good example,
      But why it doesn't work with me when i tried to but the codes at Dreamweaver could you attach the source code please.

      Delete
  8. Its working perfectly. Thanks a lot

    ReplyDelete
  9. how to disable right click context menu on youtube videos plese help me if any possible

    ReplyDelete
  10. Hi, That's Superb Tutorial, It is very helpful knowledge, I like it, Thanks a lot for shared..........

    ReplyDelete
  11. Try this:

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

    ReplyDelete
  12. Ha tell me how to disable mouse right click popup menu on modal window

    ReplyDelete
  13. Thank for alert box but is it possible to show disable message in custom popup? If yes please can you provide me demo link.

    ReplyDelete
  14. interesting writing, no doubt i learn lots by this tutorial

    ReplyDelete
  15. Perfect tip thanks :)
    another question
    some script that closes the window by clicking right mouse ?

    ReplyDelete