在 mozilla firefox 中复制到剪贴板纯 javascript 函数答案

【问题标题】：Copy to clipboard pure javascript function in mozzila firefox在 mozilla firefox 中复制到剪贴板纯 javascript 函数
【发布时间】：2015-12-03 13:52:40
【问题描述】：

我需要制作一个可以在每个页面和浏览器上工作的按钮，它可以从文本区域复制输入。我正在尝试使用以下功能来做到这一点：

 selectElementContents: function(){
      el = document.getElementById("tag_text");

      var range = document.createRange();
      range.selectNode(el);
      window.getSelection().removeAllRanges();
      window.getSelection().addRange(range);

      try {
        var successful = document.execCommand('copy');
      } catch(err) {
        console.log('Oops, unable to copy');
      }

目前在除 Firefox 和 Safari 之外的所有浏览器上都可以正常工作。我读了一些关于 Safari 的文章，似乎它不支持这样的功能，还是我弄错了？但是，当我尝试使用 document.execCommand('copy') 复制输入内容时，会引发以下错误：[Exception... "Failure" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: debugger eval code :: <TOP_LEVEL> :: line 1" data: no]。我查了这个错误，它有点通用，因为代码出现在不止一个错误提示中。

最后我的问题是如何让它在 Firefox 上运行，有什么问题？

【问题讨论】：

这可能有助于stackoverflow.com/questions/21696052/…
我无法创建插件。此功能必须适用于每个销售产品的网站。
netscape.security.PrivilegeManager。 vidriduch 你知道那是什么吗？
抱歉，不确定，但请查看@nh2 的最后一个答案以及他/她指向的错误...

标签： javascript html firefox

【解决方案1】：

不幸的是，

execCommand('copy') 并非所有地方都支持。它也不是很安全，因为它会在不提醒用户的情况下将内容放入剪贴板。

在任何情况下，您都可以将 execCommand('copy') 与此 answer 中提供的解决方案结合起来，用于不受支持的浏览器，如下所示：

HTML：

<form id="test_form">
  <p>Copy this:</p>
  <input id="tag_text" type="text" size="40" />
  <input type="button" onClick="select_element_contents()" value="Copy" />
</form>

Javascript：

function select_element_contents (){
    var el = document.getElementById("tag_text");
    var el_text = el.value;

    var range = document.createRange();
    range.selectNode(el);
    window.getSelection().removeAllRanges();
    window.getSelection().addRange(range);

    try {
        var successful = document.execCommand('copy');
    } catch(err) {
        window.prompt("Copy to clipboard: Ctrl+C/Cmd+C, Enter", el_text);
    }
}

当然，这并不理想，但由于 Mozilla Firefox 不支持自动复制到剪贴板，因此用户必须按下按钮。还不如让它尽可能透明。

【讨论】：