实现页面文本内容不可选中 — 不可复制.md

实现页面文本内容不可选中 — 不可复制

CSS

使用 user-select: none 不可选中，也就不可以复制。

body {
  user-select: none;
}

使用 JS

• 监听 selectstart 事件，禁止选中。
• 监听 copy 事件，不可复制。

当用户选中一片区域时（包括点击），将触发 selectstart 事件，Selection API 将会选中一片区域。禁止选中区域（使用 preventDefault 阻止事件的默认行为）即可实现页面文本不可复制。

// 不可选中
document.documentElement.onselectstart = (e) => {
  e.preventDefault()
}

// 不可复制
document.documentElement.oncopy = (e) => {
  e.preventDefault()
}