How to Disable Copy, Cut, and Paste with JavaScript/jQuery.

You can allow text selection, but prevent copy and cut functions using the oncopy, oncut and onpaste event attributes. By adding these attributes to a textbox’s tag, you can disable cut, copy and paste features. The user is left with the option to enter the field manually with these attributes set.

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <h2>Copy, cut and paste disabled</h2>
    <input type="text" onselectstart="return false" onpaste="return false;" onCopy="return false" onCut="return false" onDrag="return false" onDrop="return false" autocomplete=off/>
    <br>
  </body>
</html>

The same effect can be achieved by using the jQuery bind() function specifying cut and copy events that are fired when the user cuts or copies a text.

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
  </head>
  <body>
    <h2>Copy and cut disabled</h2>
    <p>I am a text and you cannot copy or cut me.</p>
    <script>
      $(document).ready(function() {
          $('body').bind('cut copy', function(e) {
              e.preventDefault();
            });
        });
    </script>
  </body>
</html>

Leave a comment

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