HTML oncopy Event Attribute

If this site has been useful, we’d love your support! Consider buying us a coffee to keep things going strong!

Description

The oncopy HTML event attribute fires when the user copies the content of an element. It is supported by all major browsers, and can be used on any HTML element, including <img>, <input>, and <p>.

The oncopy attribute takes a JavaScript function as its value. This function will be executed whenever the user copies the content of the element. The function can take a single argument, which is an Event object that contains information about the event.

Here is an example of how to use the oncopy attribute:

<input type="text" id="myInput" oncopy="myCopyFunction()">

The myCopyFunction() function will be executed whenever the user copies the text from the myInput input field. Here is an example of what this function could do:

function myCopyFunction() {
  // Get the text that the user is copying.
  var copiedText = document.getElementById("myInput").value;

  // Display the copied text to the user.
  alert("You copied the following text: " + copiedText);
}

The oncopy attribute can be used to implement a variety of features, such as:

Preventing users from copying certain content. For example, you could use the oncopy attribute to prevent users from copying the contents of a copyright-protected document.
Tracking when users copy content. For example, you could use the oncopy attribute to track which users are copying content from your website, and how often they are doing it.
Performing additional actions when users copy content. For example, you could use the oncopy attribute to automatically send a copy of the copied content to a server for logging purposes.

Syntax

<element oncopy="script">

Values

scriptThe name of the script to use when the event has been triggered.

Example

HTML

<!DOCTYPE html> 

  <html> 

    <head>

      <title>oncopy event</title> 

    </head> 

    <body> 

    <input type="text" oncopy="copyAlarm()" value="Copy this text"> 

    <p id="test"> </p> 

<script> 

function copyAlarm() {

  document.getElementById("test").innerHTML="Text has been copied to clipboard!"; 

} 

</script> 

  </body> 

</html>

Result

Editor

Browser Support

The following information will show you the current browser support for the HTML oncopy event attribute. Hover over a browser icon to see the version that first introduced support for this HTML event attribute.