The copy
event fires when the user initiates a copy action through the browser's user interface.
Bubbles | Yes |
---|---|
Cancelable | Yes |
Interface | ClipboardEvent |
Event handler property | oncopy |
The event's default action is to copy the selection (if any) to the clipboard.
A handler for this event can modify the clipboard contents by calling setData(format, data)
on the event's ClipboardEvent.clipboardData
property, and cancelling the event's default action using event.preventDefault()
.
However, the handler cannot read the clipboard data.
It's possible to construct and dispatch a synthetic copy
event, but this will not affect the system clipboard.
Examples
Live example
HTML
<div class="source" contenteditable="true">Try copying text from this box...</div> <div class="target" contenteditable="true">...and pasting it into this one</div>
CSS
div.source, div.target { border: 1px solid gray; margin: .5rem; padding: .5rem; height: 1rem; background-color: #e9eef1; }
JS
const source = document.querySelector('div.source'); source.addEventListener('copy', (event) => { const selection = document.getSelection(); event.clipboardData.setData('text/plain', selection.toString().toUpperCase()); event.preventDefault(); });
Result
Specifications
Specification | Status |
---|---|
Clipboard API and events | Working Draft |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
copy event | Chrome Full support 58 | Edge Full support ≤18 | Firefox Full support Yes | IE Full support Yes | Opera Full support 45 | Safari Full support Yes | WebView Android Full support 58 | Chrome Android Full support 58 | Firefox Android Full support Yes | Opera Android Full support 43 | Safari iOS Full support Yes | Samsung Internet Android Full support 7.0 |
clipboardData | Chrome Full support 58 | Edge Full support ≤18 | Firefox Full support 22 | IE No support No | Opera Full support 45 | Safari Full support Yes | WebView Android Full support 58 | Chrome Android Full support 58 | Firefox Android Full support 22 | Opera Android Full support 43 | Safari iOS Full support Yes | Samsung Internet Android Full support 7.0 |
Legend
- Full support
- Full support
- No support
- No support