HTML oncut Attribute

Introduction

The oncut attribute is an inline event handler that runs JavaScript when the cut event fires. That happens when the user cuts content — with Ctrl+X (Cmd+X on Mac), Edit → Cut, or the context menu Cut action. Unlike copy, cut removes the selection from the source after placing it on the clipboard. It is common on contenteditable regions, textarea, and input fields. Use it for validation before removal, logging edits, or customizing clipboard data with event.clipboardData. The cut event bubbles. For production sites, prefer addEventListener("cut", …) over inline handlers.

What You’ll Learn

Purpose of oncut Attribute

The primary purpose of oncut is to react when the user cuts text or content from an editable element. Common uses include validating that removed content is allowed, showing a “Text cut” message, logging editor changes, or customizing what lands on the clipboard via event.clipboardData. Because cut both copies and removes, your handler runs before the selection disappears — use event.preventDefault() to block the cut if needed.

Do not confuse oncut with oncopy. Copy duplicates content; cut moves it off the page. Pair with onpaste for full clipboard coverage. Avoid blocking cut without a good reason — users rely on Cut for editing and accessibility workflows.

📝 Syntax

Set oncut on an editable element or assign element.oncut:

<script>

  function handleCut() {

    document.getElementById("status").textContent = "Content cut!";

  }

</script>



<div contenteditable="true" oncut="handleCut()">

  Select and cut this editable text.

</div>

<p id="status"></p>

Syntax Rules

• Value is JavaScript code executed when the user cuts from the element.
• Pass event when you need clipboardData or preventDefault().
• Works on editable elements: contenteditable, textarea, input, etc.
• JavaScript: element.oncut = function(e) { … }.
• Modern alternative: element.addEventListener("cut", handler).
• The cut event bubbles — you can delegate on a parent container.

💎 Values

The oncut attribute accepts a string of JavaScript code:

• oncut="handleCut()" — Call a named function.
• oncut="handleCut(event)" — Pass the event for clipboard access or cancellation.
• JavaScript: field.oncut = (e) => { … } assigns the handler.

const editor = document.getElementById("editor");

editor.addEventListener("cut", (event) => {

  const selection = window.getSelection().toString();

  if (selection.length > 500) {

    event.preventDefault();

    document.getElementById("msg").textContent = "Cannot cut more than 500 characters.";

    return;

  }

  document.getElementById("msg").textContent = "Cut allowed.";

});

Applicable Elements

oncut vs oncopy vs onpaste

Examples Gallery

Inline oncut on contenteditable, addEventListener with validation, and comparing cut with copy events.

<div contenteditable="true" oncut="handleCut()">

  Try cutting this text!

</div>



<script>

  function handleCut() {

    document.getElementById("msg").textContent = "Text cut!";

  }

</script>

const editable = document.getElementById("dynamicEditable");

editable.oncut = function () {

  console.log("Dynamic content cut!");

};



// Or preferred form:

editable.addEventListener("cut", () => {

  console.log("Cut detected via addEventListener.");

});

field.addEventListener("cut", () => {

  log("cut — removed from field");

});



field.addEventListener("copy", () => {

  log("copy — duplicated to clipboard");

});

♿ Accessibility

• Do not block cut lightly — Users rely on Cut for editing and assistive workflows. Avoid preventDefault() unless validation truly requires it.
• Provide feedback — A visible status message helps users understand that their cut action was registered.
• contenteditable accessibility — Editable regions need clear labels and keyboard focus styles so users know where they can edit and cut.
• Avoid alert() on cut — Use inline status text or toast-style messages instead of modal alerts.
• Keyboard users — Cut via Ctrl+X / Cmd+X must still work when you add custom cut handlers.

💡 Best Practices