HTMLElement:copy 事件
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.
copy
事件在用户通过浏览器的用户界面开始复制操作时触发。
语法
在类似 addEventListener()
这样的方法中使用事件名称,或设置事件处理器属性。
js
addEventListener("copy", (event) => {});
oncopy = (event) => {};
事件类型
ClipboardEvent
。继承自 Event
。
事件属性
也从其父接口 Event
继承属性。
ClipboardEvent.clipboardData
只读-
一个
DataTransfer
对象,其包含用户发起的cut
、copy
或paste
操作所影响的数据,以及它的 MIME 类型。
示例
此示例阻止每一次对 <textarea>
的复制和粘贴的尝试。
HTML
html
<h3>试一下这个文本区域:</h3>
<textarea id="editor" rows="3">
尝试对该字段复制和粘贴文本!
</textarea>
<h3>日志:</h3>
<p id="log"></p>
JavaScript
js
const log = document.getElementById("log");
function logCopy(event) {
log.innerText = `已阻止复制!\n${log.innerText}`;
event.preventDefault();
}
function logPaste(event) {
log.innerText = `已阻止粘贴!\n${log.innerText}`;
event.preventDefault();
}
const editor = document.getElementById("editor");
editor.oncopy = logCopy;
editor.onpaste = logPaste;
结果
规范
Specification |
---|
Clipboard API and events # clipboard-event-copy |
HTML Standard # handler-oncopy |
浏览器兼容性
BCD tables only load in the browser