Disable Right Click on Website Using JavaScript
In this tutorial we will see how to Disable Right Click on Website Using JavaScript. .preventDefault() method and contextmenu event are used for this purpose.
Table of Contents
HTML Code
HTML Code is given below.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Disable Right Click on Website Using JavaScript</title>
</head>
<body>
</body>
</html>
JavaScript Code
JavaScript Code is given below, In this code contextmenu event handler is attached with document, so that whenever right click event occurs the preventDefault() function is called which cancels the event and then message is displayed.
<script>
document.addEventListener("contextmenu", function(event){
event.preventDefault();
alert('Right Click is Disabled');
}, false);
</script>
DEMO
To disable the right-click functionality on a website using JavaScript, you can use the contextmenu
event and the preventDefault()
method. Here’s an example:
<!DOCTYPE html>
<html>
<head>
<script>
// Disable right-click function
document.addEventListener("contextmenu", function(e) {
e.preventDefault();
});
</script>
</head>
<body>
<!-- Your website content goes here -->
</body>
</html>
In this example, the JavaScript code adds an event listener to the contextmenu
event on the document
object. When the user right-clicks on the website, the event is triggered, and the preventDefault()
method is called to prevent the default context menu from appearing.
Keep in mind that disabling the right-click functionality can be considered a usability issue and may interfere with users’ expectations and accessibility features. Additionally, determined users can bypass this restriction using browser developer tools or keyboard shortcuts. Therefore, it’s essential to consider the implications and user experience before implementing such restrictions on your website.