Thursday, 25 August 2016

Disable right click on web page using JQuery

In this post, I will explain how to disable right click on a web page or on particular control using JQuery?

There are many reasons a developer may want to disable right-click on a web page or on controls. With JQuery it’s really simple to disable right-click on a web page or on controls
Please go through below code to disable right-click on a web page or particular control.

<!DOCTYPE html>
<html lang="">
<head>
    <title>Disable right click on web page using JQuery</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {

            // Code to disable right click on a page
            $(document).bind('contextmenu', function (e) {
                e.preventDefault();
                alert('Right click is disabled');
            });

            // Code to disable right click on a particular element
            /*$('.control').bind('contextmenu',function(e){
            e.preventDefault();
            alert('Right Click is not allowed on div');
            });*/
        });
    </script>
</head>
<body>
    <div class="control" style="border:1px solid Red; width:300px;height:200px;">
        <p>Please right click to test this example</p>
    </div>
</body>
</html>

0 comments:

Post a Comment

Please do not enter any spam link in the message box.