How To Prevent Copy Content Using JavaScript

In this article, we will learn how to prevent the user from copying content using JavaScript.

If in an HTML page, the user should not be allowed to copy a text. You can use JavaScript for this.

<!DOCTYPE html>
<html>
<body>
    <h1 oncopy="return false;">TheCodeHubs</h1>
    <p>Enter Any Value: </p>
    <input oncopy="return false;" oncut="return false;" />
</body>
</html>

Here, on <h1> element we applied oncopy attribute. Where, on <input> element we applied oncopy and oncut attributes because <input> element provides both copy and cut options.

In the above example, we applied oncopy attribute on separate elements. We can also apply it on <body> element as shown below.

<!DOCTYPE html>
<html>
<body oncopy="return false;" oncut="return false;">
    <h1>TheCodeHubs</h1>
    <p>Enter Any Value: </p>
    <input />
</body>
</html>

That’s it.

Output:

Also, check How To Prevent Copy Content Using CSS

Yasin Panwala

Yasin Panwala is a Web Developer and Author at TheCodeHubs. He has experience in Web Developing and Designing and also in Writing. He has got his skills in working on technologies like .NET Core, ADO.NET, AJAX, Angular, AngularJS, ASP.NET, ASP.NET MVC, Bootstrap, C#, CSS, Entity Framework, Express.js, GraphQL, HTML, JavaScript, JQuery, JSON, LINQ, Microsoft Office, MongoDB, MySQL, Node.js, PostgreSQL, SQL, SQL Server, TypeORM, TypeScript, Visual Basic .NET, Web API. He also got his skills in working with different integration and some known versioning tools. He is always ready to learn new things and he always tries his best on tasks that are assigned to him and gives the best possible outputs.