HTMLElement: copy Event
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017.
Das copy-Ereignis wird ausgelöst, wenn der Benutzer eine Kopieraktion über die Benutzeroberfläche des Browsers initiiert.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.
js
addEventListener("copy", (event) => {});
oncopy = (event) => {};
Ereignistyp
Ein ClipboardEvent. Erbt von Event.
Ereigniseigenschaften
Erbt auch Eigenschaften von seinem übergeordneten Event.
ClipboardEvent.clipboardDataNur lesbar-
Ein
DataTransfer-Objekt, das die von der vom Benutzer initiiertencut-,copy- oderpaste-Operation betroffenen Daten sowie ihren MIME-Typ enthält.
Beispiel
Dieses Beispiel blockiert jeden Kopier- und Einfügeversuch innerhalb des <textarea>.
HTML
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
js
const log = document.getElementById("log");
function logCopy(event) {
log.innerText = `Copy blocked!\n${log.innerText}`;
event.preventDefault();
}
function logPaste(event) {
log.innerText = `Paste blocked!\n${log.innerText}`;
event.preventDefault();
}
const editor = document.getElementById("editor");
editor.oncopy = logCopy;
editor.onpaste = logPaste;
Ergebnis
Spezifikationen
| Specification |
|---|
| Clipboard API and events # clipboard-event-copy |
| HTML Standard # handler-oncopy |
Browser-Kompatibilität
BCD tables only load in the browser