HTML oncut Event Attribute

Description

The oncut HTML event attribute is used to specify a JavaScript function to be executed when the user cuts the content of an element. It is supported by all HTML elements, but it is only possible to cut the content of an element if it has the contenteditable attribute set to true.

The oncut event is mostly used on input elements with type="text". It can be used to perform various tasks, such as:

Saving the cut content to a variable or database
Preventing the user from cutting the content
Performing other actions, such as disabling a button or displaying a message

To use the oncut event attribute, simply add it to the HTML element that you want to monitor. The value of the attribute should be the name of the JavaScript function that you want to be executed when the event occurs.

For example, the following code shows how to use the oncut event attribute to save the cut content to a variable:

<input type="text" oncut="saveCutContent()" value="This is some text">

The following JavaScript function would then be used to save the cut content to a variable:

function saveCutContent() {
  var cutContent = window.clipboardData.getData('Text');
  // Save the cut content to a variable or database
}

The oncut event can be used in conjunction with other event attributes, such as oncopy and onpaste, to implement more complex functionality. For example, you could use the oncut event to prevent the user from cutting the content of an element, and then use the oncopy event to copy the content to the clipboard instead.

Syntax

<element oncut="script">

Values

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

Example

HTML

<!DOCTYPE html> 

  <html> 

    <head>

      <title>oncut event</title> 

    </head> 

    <body> 

    <input type="text" oncut="cutAlarm()" value="Cut this text."> 

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

<script> 

function cutAlarm() {

  document.getElementById("test").innerHTML = "The oncut attribute has been triggered!"; 

  } 

</script> 

  </body> 

</html>