Categories
JavaScript Answers

How to disable right click on images using jQuery?

Spread the love

Sometimes, we want to disable right click on images using jQuery.

In this article, we’ll look at how to disable right click on images using jQuery.

How to disable right click on images using jQuery?

To disable right click on images using jQuery, we can return false in the contextmenu event handler.

For instance, we write:

<div id='nearestStaticContainer'>
  <img src='https://i.picsum.photos/id/290/200/300.jpg?hmac=kjRyFwJ6i5kuROjzxcs6QbXbBr8EptbH5AuVxtMxhQ0'>
</div>

to add an img element in a div.

Then we write:

$('#nearestStaticContainer').on('contextmenu', 'img', (e) => {
  return false;
});

to select the div with $.

And then we call on with 'contextmenu, 'img' and the contextmenu event handler for the div.

We listen for the contextmenu event emitted on img elements within the div.

And we return false to disable right clicks on the images.

Conclusion

To disable right click on images using jQuery, we can return false in the contextmenu event handler.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *