64

随着闪存在许多环境（iPhone、Android、IE10 等）中的出现，是否有任何新的解决方案出现在任何浏览器中，可以在不安装闪存的情况下将信息安全复制到剪贴板？

到目前为止，我一直在使用ZeroClipboard，但我担心更多没有 Flash 的观众，这个功能会被破坏，我希望尽可能不依赖 Flash。

4

6 回答 6

20

原因是自动复制到剪贴板可能非常危险，因此大多数浏览器（IE 除外）* 都会使其变得困难，除非您使用 Flash。

就像您的ZeroClipboard一样，还有Clipboard LMCButton，它也使用在后台运行的小型 Flash 脚本。

一个常见的解决方案是这样做：

 function copyToClipboard (text) {
     window.prompt ("Copy to clipboard: Ctrl+C, Enter", text);
 }

当其他人在这里问这个问题时，我从 Jarek Milewski 那里找到了

*是的，我找到了一种适用于 IE 的解决方案，但在大多数现代浏览器中不起作用，请查看此处。

更新：

据此：https ://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand Firefox 41+、Chrome 42+ 和 IE 9+ 支持带有 execCommand 的复制命令。对于 firefox 和 chrome，它只有在由用户操作（如点击）触发时才会起作用，对于 IE，它会给用户一个警告对话框，询问他们是否允许复制到剪贴板。

于 2012-06-21T14:49:39.843 回答
19

我知道这个答案来得有点晚，但现在有一个新的现代替代 ZeroClipboard（基于 Flash）。Clipboard.js是一个2kB 的纯 JavaScript替代方案，没有依赖项。

于 2015-11-01T18:09:40.533 回答
8

我创建了一个名为 clip-j 的纯 JavaScript 解决方案。在这里。基本上，它的作用是利用document.execCommand('copy');其他一些命令来实现它，因此您什么都看不到。这是代码：

function clip(text) {   
    var copyElement = document.createElement('input');      
    copyElement.setAttribute('type', 'text');   
    copyElement.setAttribute('value', text);    
    copyElement = document.body.appendChild(copyElement);   
    copyElement.select();   
    document.execCommand('copy');   
    copyElement.remove();
}
于 2015-09-07T01:48:56.253 回答
3

您可以查看这篇博文，深入讨论如何在 HTML5 中使用剪贴板。不幸的是，您仍然无法在单击时便携地复制到剪贴板。但是，对于 chrome 和 firefox，您可以创建一个浏览器扩展程序，可以授予您的站点访问剪贴板的权限，并且我相信 IE 会让您复制到剪贴板，但会提示用户授予权限。

更新：

据此：https ://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand Firefox 41+、Chrome 42+ 和 IE 9+ 支持带有 execCommand 的复制命令。对于 firefox 和 chrome，它只有在被点击等用户操作触发时才会起作用，对于 IE，它会给用户一个警告对话框，要求他们允许复制到剪贴板。

于 2015-04-11T18:49:02.493 回答
0

这个问题有很好的答案，我选择使用这个片段：

function copyToClipboard(element) {
    var $temp = $("<input>");
    $("body").append($temp);
    $temp.val($(element).text()).select();
    document.execCommand("copy");
    $temp.remove();
}

但是，如果您的页面上有 bootstrap-select，则该$temp.val($(element).text()).select()行将引发错误：

小部件只能在选择元素上工作

您可以.trigger('select')改用，如.select() 的 jQuery 文档中所述，如下所示：

$temp.val($(element).val()).trigger('select');
于 2017-12-14T14:23:16.550 回答
0

要使用 execCommand，您必须首先在页面上选择（）某些内容，因此您不能只是复制最后放入剪贴板的内容。使用这个函数，我将输入文本框的 id 传递给函数并选择（）它，然后执行复制命令。无需添加侦听器或使您的代码进一步复杂化。如果未启用或不支持 document.execCommand() 将返回 false，因此您可以使用 window.prompt 作为备份方法。

function copyToClipboard(id) {
    var blnCopied;
    document.getElementById(id).select();
    blnCopied = document.execCommand("copy", false, null);
    if (blnCopied)
        alert('Link copied to clipboard');
    else
        window.prompt ("Copy to clipboard: Ctrl+C, Enter", jQuery("#"+id).val());
}

使用带有 onclick="copyToClipboard('some_id')" 的标准“a”锚标记

于 2017-03-29T15:42:03.863 回答