12

哟，

好吧，一直在研究这个问题：如何在不带任何样式包袱（背景颜色、颜色等）的情况下复制/剪切样式文本？

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

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

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

4

4 回答 4

9

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

我已经用 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();
});
于 2019-05-15T20:55:22.240 回答
5

我现在没有时间编写一个示例，但是您可以为键盘快捷键触发的剪切/复制执行此操作。它不适用于通过上下文菜单或编辑菜单选项进行剪切/复制，因为它依赖于在剪切或复制事件触发之前更改用户选择。

步骤：

  1. 处理Ctrl-C和Ctrl-X键盘快捷键和 Mac 等效项。
  2. 在此处理程序中，创建一个离屏元素（例如，绝对位置和左侧 -10000 像素）并将所选内容复制到其中。您可以使用 来执行此操作window.getSelection().getRangeAt(0).cloneContents()，但对于 IE < 9，您需要单独的代码，并且您应该检查选择是否折叠。
  3. 随心所欲地更改屏幕外元素内容的样式。
  4. 移动选择以包含屏幕外元素的内容，以便剪切或复制此内容。
  5. 添加一个短暂的延迟（几毫秒），使用 towindow.setTimeout()调用一个删除屏幕外元素并恢复原始选择的函数。
于 2011-09-17T10:21:46.513 回答
0

您是否需要在浏览器中为每个用户执行此操作？

如果没有——它只适合你——那么你可以使用 Clipmate 软件来做到这一点。

http://www.clipmate.com/index.htm

它具有删除所有样式的功能。

于 2011-09-16T01:53:40.727 回答
0

一旦触发了复制或剪切，您就可以剥离 html 标签，并且只剥离带有一些正则表达式的文本

var String = Sample.replace(/(<([^>]+)>)/ig,"");

此外，如果您将存储的文本存储在 id 为“sample_div”的 div 中，请使用var String=$('sample_div').text('');仅获取其中的文本

于 2011-09-16T02:10:03.660 回答