mymotherland
mymotherland

Reputation: 8228

How to prevent Right Click option using jquery

Is it possible to prevent RIGHT CLICK option for IMAGES which we use in web page.

Upvotes: 46

Views: 121689

Answers (16)

Maulik patel
Maulik patel

Reputation: 2432

     jQuery("#wpcf7-f608-p651-o1").on("contextmenu",function(e){
                    return false;
                }); 
                jQuery('.messagedata').keydown(function(event) {
                    if (event.ctrlKey==true && (event.which == '118' || event.which == '86')) {
                        //alert('thou. shalt. not. PASTE!');
                        event.preventDefault();
                     }
                });
                jQuery(document).on('keypress', '.messagedata', function (e) {
                    const pressedKey = e.key;
                    let pressedKeyCode = e.charCode;
                    
                    
                    if ((pressedKeyCode >= 33 && pressedKeyCode <= 47) || 
                        (pressedKeyCode >= 58 && pressedKeyCode <= 64) || 
                        (pressedKeyCode >= 91 && pressedKeyCode <= 96) || 
                        (pressedKeyCode >= 123 && pressedKeyCode <= 126) ) 
                    {
                        e.preventDefault();
                    
                        
                    }
                    else {
                        
                    }
                });
    jQuery('textarea').bind('input', function() {
  var c = this.selectionStart,
      r = /[^a-z0-9 .]/gi,
      v = jQuery(this).val();
  if(r.test(v)) {
    jQuery(this).val(v.replace(r, ''));
    c--;
  }
  this.setSelectionRange(c, c);
});

Upvotes: -1

Daniel
Daniel

Reputation: 11

Try This!!

$('#element').mousedown(function(event) {
    switch (event.which) {
        case 3:
           $("img").on("contextmenu",function(){
       return false;
    }); 
            break;
    }
});

Upvotes: 1

BaSsGaz
BaSsGaz

Reputation: 784

You can also use the .contextmenu() shortcut method. For example:

$(document).ready(function() {
    $("#logo").contextmenu(function(e){
       return false;
    }); 
}); 
body {
    background-color: #FFF;
}
#logo {
    background: url(http://stackoverflow.com/favicon.ico) no-repeat; 
    width: 182px; 
    height: 30px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Try right-click on the logo.
<div id="logo"></div>

Upvotes: 0

Haider Naqvi
Haider Naqvi

Reputation: 11

$(document).ready(function () {

        $("img").on('contextmenu', function (e) {
           e.preventDefault();
        });

});

Upvotes: 1

Rohit Agrohia
Rohit Agrohia

Reputation: 418

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script>
 $(document).ready(function(){
  $(document).bind("contextmenu",function(e){
  return false;
  });
});
</script>
</head>
<body>

<p>Right click is disabled on this page.</p>

</body>
</html>

Upvotes: 1

Akhil Jain
Akhil Jain

Reputation: 1

$(document).mousedown(function(e) {
    if( e.button == 2 ) {
         e.preventDefault();
        return false;
    } 
});

Upvotes: -1

Amit mishra
Amit mishra

Reputation: 417

<body oncontextmenu="return false" onselectstart="return false" ondragstart="return false" >

Set these attributes in your selected tag

See here Working Example - https://codepen.io/Developer_Amit/pen/drYMMv

No Need JQuery (like)

Upvotes: 9

Black
Black

Reputation: 20212

Here is a working example, the red links can't be right clicked anymore.

$("ul.someLinks1 a").each(function(i, obj) {

  $(obj).on("contextmenu",function(){
     return false;
  }); 
  
  $(obj).css("color", "red");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="someLinks1">
  <li><a href="www.google.de">google</a></li>
  <li><a href="www.stackoverflow.de">stackoverflow</a></li>
  <li><a href="www.test.de">test</a></li>
</ul>

<ul class="someLinks2">
  <li><a href="www.foobar.de">foobar</a></li>
  <li><a href="www.foo.de">foo</a></li>
  <li><a href="www.bar.de">bar</a></li>
</ul>

Upvotes: 1

Payal Mittal
Payal Mittal

Reputation: 121

Try this:

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

Upvotes: 4

Abdul Kader
Abdul Kader

Reputation: 5842

I think this should help. Trick is to bind the contextmenu event.

<script type="text/javascript" language="javascript">
        $(function() {
            $(this).bind("contextmenu", function(e) {
                e.preventDefault();
            });
        }); 
</script>

Upvotes: 18

Anupam
Anupam

Reputation: 8016

$(document).ready(function() {

    $(document)[0].oncontextmenu = function() { return false; }

    $(document).mousedown(function(e) {
        if( e.button == 2 ) {
            alert('Sorry, this functionality is disabled!');
            return false;
        } else {
            return true;
        }
    });
});

If you want to disable it only on image click the instead of $(document).mousedown use $("#yourimage").mousedown

Upvotes: 6

GIPSSTAR
GIPSSTAR

Reputation: 2100

Method 1:

<script type="text/javascript" language="javascript">
        $(document).ready(function(){

        $(document).bind("contextmenu",function(e){

            return false;

            });

    });

</script>

Method 2:

<script type="text/javascript" language="javascript">
        $(document).ready(function(){

        $(document).bind("contextmenu",function(e){

            e.preventDefault();

            });

    });

</script>

Upvotes: 1

JoyGuru
JoyGuru

Reputation: 1833

The following code will disable mouse right click from full page.

$(document).ready(function () {
   $("body").on("contextmenu",function(e){
     return false;
   });
});

The full tutorial and working demo can be found from here - Disable mouse right click using jQuery

Upvotes: 4

Barath Kumar
Barath Kumar

Reputation: 439

Here i have found some useful link, with live working example.

I have tried its working fine.

How to prevent Right Click option using jquery

$(document).bind("contextmenu", function (e) {
        e.preventDefault();
        alert("Right Click is Disabled");
    });

Upvotes: 1

Peeter
Peeter

Reputation: 9382

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

Working example: http://jsfiddle.net/vak9exyk/

Upvotes: 139

Richard Neil Ilagan
Richard Neil Ilagan

Reputation: 14747

If you're looking into trying to disable the downloading/saving of your images, scripts won't stop that. You would probably have better luck doing this on a server configuration level (like modifying your .htaccess for example on Apache).

Try asking this on ServerFault.

Upvotes: -3

Related Questions