HTMLElement: cut イベント

cut イベントは、ユーザーがブラウザーのユーザーインターフェイスから切り取り操作を行おうとした時に発行されます。

構文

このイベント名を addEventListener() のようなメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

addEventListener('cut', event => { });

oncut = event => { };

イベント型

ClipboardEvent です。 Event を継承しています。

Event ClipboardEvent

イベントプロパティ

親である Event から継承したプロパティもあります。

ClipboardEvent.clipboardData 読取専用

DataTransfer オブジェクトで、ユーザーが行った cut, copy, paste 操作によって影響されたデータと MIME タイプが入ります。

例

この例では、テキストを <textarea> からコピーすることはできますが、テキストを切り取りすることはできません。また、コピーと切り取りをしようとしたことをそれぞれ記録します。

HTML

<h3>このテキストエリアで実行しましょう。</h3>
<textarea id="editor" rows="3">このフィールド内のテキストをコピーしたり切り取りしたりしてみましょう。</textarea>

<h3>ログ:</h3>
<p id="log"></p>

JavaScript

function logCopy(event) {
  log.innerText = 'Copied!\n' + log.innerText;
}

function preventCut(event) {
  event.preventDefault();
  log.innerText = 'Cut blocked!\n' + log.innerText;
}

const editor = document.getElementById('editor');
const log = document.getElementById('log');

editor.oncopy = logCopy;
editor.oncut = preventCut;

結果

仕様書

Specification
Clipboard API and events
# clipboard-event-cut
HTML Standard
# handler-oncut

ブラウザーの互換性

BCD tables only load in the browser

関連情報