基于闪存的ZeroClipboard的HTML5替代品,用于将数据安全地复制到剪贴板?
随着许多环境(iPhone,Android,IE10等)的出路闪存,是否有任何新的解决scheme即将在任何浏览器,将允许安全的信息复制到剪贴板没有安装闪存?
到目前为止,我一直在使用ZeroClipboard ,但是我担心更多的没有Flash的观众,这个function将会被打破,我希望尽可能不依靠Flash。
原因是自动复制到剪贴板可能是非常危险的,因此大多数浏览器(IE除外)*使它很难,除非你使用闪存。
就像您的ZeroClipboard一样 , 剪贴板LMCButton也使用在后台运行的小型Flash脚本。
一个常见的解决scheme是做到这一点:
function copyToClipboard (text) { window.prompt ("Copy to clipboard: Ctrl+C, Enter", text); }
我从Jarek Milewskifind了其他人在这里问这个问题的时候
*是的,我find了一个针对IE的解决scheme,但是在大多数现代浏览器中都不起作用, 请点击这里 。
我知道这个答案迟了一点,但现在有一个新的现代替代ZeroClipboard(这是基于Flash)。 Clipboard.js是一个2kB的纯JavaScript替代品, 没有依赖关系 。
我创build了一个名为clip-j的纯JavaScript解决scheme。 在这里 。 基本上它是利用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(); }
您可以查看这篇博客文章 ,深入讨论如何在HTML5中使用剪贴板。 不幸的是,你仍然无法移植到点击剪贴板上。 但是,对于Chrome和Firefox,你可以创build一个浏览器扩展,可以给你的网站访问剪贴板的权限,我相信IE会让你复制到剪贴板,但会提示用户授予权限。
更新 :
根据这个: https : //developer.mozilla.org/en-US/docs/Web/API/Document/execCommand Firefox 41+,Chrome 42+和IE 9+支持使用execCommand的copy命令。 对于Firefox和Chrome浏览器,只有在用户操作(如点击)触发时才能正常工作,对于IE浏览器则会给用户一个警告对话框,要求他们允许复制到剪贴板。
要使用execCommand,你必须首先select()页面上的东西,所以你不要复制上一次放入剪贴板的东西。 使用此function,我将input文本框的id传递到函数中并select(),然后执行复制命令。 不需要添加监听器或使代码更复杂。 如果未启用或支持,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”