Question

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

 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上运行并出现什么问题？

Answer 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不支持自动复制到剪贴板，因此用户必须按下按钮。不妨让它尽可能透明。

在mozzila firefox中复制到剪贴板纯javascript函数

1 个答案: