javascript - 使用 CSS 或 Javascript 复制/剪切时从文本中删除样式

Question

哟，

好吧，这个问题已经研究了一段时间:如何在不带任何样式包袱(背景颜色、颜色等)的情况下复制/剪切样式文本？

几条已被挫败的攻击路线:

1. 使用::select 设置不同的文本样式？ 不起作用，::style 未被复制
2. 使用 jQuery 的选择绑定(bind)设置所选文本的样式 这仅适用于输入，不适用于 p、div
3. 通过绑定(bind)一个事件来使用 jQuery 进行复制/粘贴来拦截和删除样式？ 无法访问复制的对象来删除内容，已尝试使用 e.preventDefault()；然后返回事件对象，但这也不起作用
4. 保存剪贴板数据后修改它？ 也没有骰子，如果没有 flash 和某种确认，大多数浏览器不会让你进入这个

无论如何，想法？看起来它对于具有白色背景颜色的网站非常有用。

Answer 1

鉴于当前的浏览器功能，您可以拦截复制事件，获取没有样式的选择，并将其放入剪贴板。

我已经使用 Chrome/Safari/Firefox 测试了这段代码。相信它也应该适用于 MS 浏览器。

document.addEventListener('copy', function(e) {
  const text_only = document.getSelection().toString();
  const clipdata = e.clipboardData || window.clipboardData;  
  clipdata.setData('text/plain', text_only);
  clipdata.setData('text/html', text_only);
  e.preventDefault();
});