dom / latest / htmlelement / paste_event.html /

HTMLElement: paste event

The paste event fires when the user initiates a paste action through the browser's user interface.

Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

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

onpaste = event => { };

Event type

Event properties

Also inherits properties from its parent Event.

ClipboardEvent.clipboardData Read only

Is a DataTransfer object containing the data affected by the user-initiated cut, copy, or paste operation, along with its MIME type.

Example

This example logs every copy and paste attempt to the <textarea>.

HTML

<h3>Play with this text area:</h3>
<textarea id="editor" rows="3">Try copying and pasting text into this field!</textarea>

<h3>Log:</h3>
<p id="log"></p>

JavaScript

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

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

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

editor.oncopy = logCopy;
editor.onpaste = logPaste;

Result

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
paste_event
1
12
9
9
5.5
Before Internet Explorer 9, this event is not supported via addEventListener.
≤12.1
3
1
18
9
≤12.1
1
1.0

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/paste_event