将选定的文本复制到剪贴板而不使用 flash - 必须跨浏览器

Question

我想要一个按钮来选择 textarea 中的文本并将其复制到剪贴板。我似乎找不到任何适用于所有浏览器且不使用 Flash 的解决方案。

当然这是可行的？我到处都看到它，但我猜他们使用闪光灯，如果可能的话我真的想远离它，因为有些人没有它。

这是我到目前为止所拥有的 - 它只是选择文本：

 function copyCode() {
  $("#output-code").focus();
  $("#output-code").select();
}

（重点不是绝对必要的）

原文由 Nick Brunt 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

execCommand(‘复制’)

有一个非常新的选择。它是跨浏览器的，但在每个人都更新他们的浏览器之前需要时间。

它通过使用 document.execCommand('copy'); 函数来工作。使用此功能，您将复制选择的文本。 This will not only work with textarea s but with every selected text on the webpage (like in span , p , div , etc .).

适用于 Internet Explorer 10+、Chrome 43+、Opera 29+ 和 Firefox 41+（参见 execCommand 兼容性 此处）。

例子

 // Setup the variables
var textarea = document.getElementById("textarea");
var answer  = document.getElementById("copyAnswer");
var copy    = document.getElementById("copyBlock");
copy.addEventListener('click', function(e) {

   // Select some text (you could also create a range)
   textarea.select();

   // Use try & catch for unsupported browser
   try {

       // The important part (copy selected text)
       var ok = document.execCommand('copy');

       if (ok) answer.innerHTML = 'Copied!';
       else    answer.innerHTML = 'Unable to copy!';
   } catch (err) {
       answer.innerHTML = 'Unsupported Browser!';
   }
});

 <textarea id="textarea" rows="6" cols="40">
Lorem ipsum dolor sit amet, eamsemper maiestatis no.
</textarea><br/>

<button id="copyBlock">Click to copy</button> <span id="copyAnswer"></span>

原文由 arc 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

这个答案虽然在 2011 年是准确的，但现在已经过时了。查看 arc 的回答，或 https://stackoverflow.com/a/30810322/489560

---

您必须使用不想使用的 Flash 插件自动将文本复制到客户端的剪贴板。浏览器是这样设计的，因为网站在不借助 active-x 组件的情况下自动修改客户端剪贴板是一个安全问题。请注意，active-x 组件是在用户机器上运行的程序，从技术上讲，需要用户同意才能安装。考虑到剪贴板是一个操作系统组件，很高兴网络浏览器默认不允许网站劫持它。

如果用户没有 Flash、禁用了 Flash 或禁用了 active-x，那么他或她可能对安全性很偏执，无论如何都不希望您弄乱他或她的键盘。到那时，用户将习惯于网站中没有太多自动或基于脚本的功能。最好不要试图公开违抗最终用户的意愿。

请参考以下 Stack Overflow 链接：

1. 如何在 JavaScript 中复制到剪贴板？
2. Javascript 中的跨浏览器 Flash 检测

最终的答案是使用零剪贴板，这是一个库，它使用一个小的、不可见的 Flash 电影和 JavaScript 来使用您想要的剪贴板功能。该库可在此处获得： https ://github.com/zeroclipboard/zeroclipboard 第二个链接显示了如何检测 Flash 是否已禁用或未安装，这使您可以像显示 JavaScript 一样显示警告消息。

原文由 Devin Burke 发布，翻译遵循 CC BY-SA 4.0 许可协议