禁用网页右键菜单与复制粘贴功能（输入框除外）

本文介绍如何通过原生 Ja vaScript 全局禁用右键菜单、文本选择、剪切复制及拖拽操作，同时保留所有 和 等可编辑元素的默认交互行为，兼顾内容防护与基础可用性。

本文介绍如何通过原生 Ja vaScript 全局禁用右键菜单、文本选择、剪切复制及拖拽操作，同时保留所有 `` 和 `` 等可编辑元素的默认交互行为，兼顾内容防护与基础可用性。

在内容敏感度较高的场景里，比如行业白皮书、SEO 核心文案页，防止被低门槛盗用几乎是绕不开的需求。需要说明的是，基于 Ja vaScript 的这类防护，并不能真正拦住技术熟练者——无论是借助 DevTools，还是直接禁用脚本，都有办法绕过去。但对大多数非技术人群来说，例如营销人员、竞品运营，这道门槛已经足以拦下“直接复制”这类行为，也能明显抬高内容被盗取的成本。

以下为推荐实现方案，采用事件委托 + 精准白名单策略，确保全局防护的同时不破坏表单交互：

// 阻断通用事件：右键、复制、剪切、选中、拖拽
function blockEvent(e) {
e.preventDefault();
e.stopPropagation();
return false;
}

// 仅传播（不阻断），用于白名单元素
function passthroughEvent(e) {
e.stopPropagation();
return true;
}

// 全局监听（捕获阶段可选，但此处使用冒泡阶段已足够）
document.addEventListener('contextmenu', blockEvent);
document.addEventListener('cut', blockEvent);
document.addEventListener('copy', blockEvent);
document.addEventListener('selectstart', blockEvent);
document.addEventListener('dragstart', blockEvent);

// 白名单：允许所有可编辑表单控件保持原生行为
const editableElements = document.querySelectorAll('input, textarea, [contenteditable="true"]');
editableElements.forEach(el => {
el.addEventListener('contextmenu', passthroughEvent);
el.addEventListener('cut', passthroughEvent);
el.addEventListener('copy', passthroughEvent);
el.addEventListener('selectstart', passthroughEvent);
el.addEventListener('dragstart', passthroughEvent);
});

✅ 关键优化点说明：

• 使用 querySelectorAll('input, textarea, [contenteditable="true"]') 替代仅 input，覆盖文本域与富文本编辑区域；
• passthroughEvent 仅调用 stopPropagation() 而非 preventDefault()，确保事件在目标元素上仍可被浏览器默认处理；
• 所有事件监听均绑定在 document 或具体元素上，避免重复绑定或内存泄漏；
• 无需 jQuery，纯原生 ES5+ 兼容，适合现代项目及需兼容 IE11 的场景（若需 IE11，请将箭头函数改为 function 声明）。

⚠️ 注意事项：

• 此方案不影响键盘快捷键（如 Ctrl+C 在禁用状态下仍可能触发，因部分浏览器对快捷键有独立处理逻辑）；如需进一步限制，可补充监听 keydown 并过滤 Ctrl/Cmd + C/V/X 组合键（但会降低可访问性，不推荐）；
• 移动端需额外考虑长按触发的系统菜单（touchstart + setTimeout 模拟禁用较复杂，且效果有限，建议优先依赖服务端水印与版权申明）；
• 务必配合其他防护手段：禁用图片右键保存（）、启用 CSP 头、添加不可见水印文字、定期全站内容指纹监控等。

最后强调：技术防护是盾，而非锁。真正可持续的护城河，始终在于持续产出不可替代的优质内容，并辅以清晰的版权声明与法律威慑。Ja vaScript 层面的限制，应定位为「友好提醒」与「效率门槛」，而非绝对屏障。