在 PURE javascript 中复制到剪贴板的方法?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16294365/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Way to copy to clipboard in the PURE javascript?
提问by jave.web
There is a way how to trick "copy to clipboard" functionality on web pages with flash...
有一种方法可以在带有 Flash 的网页上欺骗“复制到剪贴板”功能...
But is there a way to make it in a PUREjavascript way (but still cross-modern-browser)?
但是有没有办法以纯javascript 的方式制作它(但仍然是跨现代浏览器)?
Beacause even adobe dropped its attention to flash while focusing more on html5...
因为即使是 adobe 也放弃了对 flash 的关注,而更多地关注 html5...
采纳答案by jave.web
There is currently no way to do that cross-browser (often disabled for security reasons).In older browsers there is no such functionality (security issues) or often must be turned on manually... But in older browsers there is a high possibility of doing this using Flash...
目前没有办法做到跨浏览器(通常出于安全原因禁用)。在较旧的浏览器中没有这样的功能(安全问题)或通常必须手动打开......但在较旧的浏览器中,使用Flash执行此操作的可能性很高......
UPDATE 2016
Still not mobile-cross-browser, but supported in newset desktop versions of major browsers...
Mozilla developer docs have now a little better description of Document.execCommand()and specifically the "copy" command:
2016 年更新
仍然不是移动跨浏览器,但在主要浏览器的新桌面版本中受支持......
Mozilla 开发人员文档现在对Document.execCommand()有更好的描述,特别是“复制”命令:
Copies the current selection to the clipboard. Conditions of having this behavior enabled varyfrom one browser to another, and have evolved over time. Check the compatibilitytable to determine if you can use it in your case.
将当前选择复制到剪贴板。启用此行为的条件因浏览器而异,并且随着时间的推移而 演变。检查兼容性表以确定您是否可以在您的情况下使用它。
GREAT NEWS! (UPDATE 2016-08)
好消息!(更新 2016-08)
Copy/cut adopted by all of the current major desktop browsers!
当前所有主要桌面浏览器均采用复制/剪切!
Compatibility tables (2016-08-10) (source: Mozilla Dev)
兼容性表 (2016-08-10)(来源:Mozilla Dev)
Desktop
桌面
Mobile
移动的
2017-03-05(both desktop&mobile):Edge - basic support & copy/cut: Yes, Chrome copy/cut support changed to 43.
2017-03-05(桌面和移动):Edge - 基本支持和复制/剪切:是的,Chrome 复制/剪切支持更改为 43。
Quote about "the Firefox way"
引用“Firefox 方式”
There is a possibility that this will be done the same way in other browsers in the future:
将来有可能在其他浏览器中以相同的方式完成此操作:
Before Firefox 41, clipboard capability needed to be enabled in the user.js preference file. See A brief guide to Mozilla preferences for more information. If the command wasn't supported or enabled, execCommand was raising an exception instead of returning false.
In Firefox 41 and later, clipboard capability are enabled by default in any event handler that is able to pop-up a window (semi-trusted scripts).
在 Firefox 41 之前,需要在 user.js 首选项文件中启用剪贴板功能。有关更多信息,请参阅 Mozilla 首选项简要指南。如果该命令不受支持或启用,则 execCommand 会引发异常而不是返回 false。
在 Firefox 41 及更高版本中,默认情况下在任何能够弹出窗口的事件处理程序中启用剪贴板功能(半可信脚本)。
This means, it is highly possible that any browser supporting copy/cut will do that onlyon user action.E.g.: Calling copy command on the fly won't work, however if bound to a click event, it works, even when the event is not prevented (e.g. navigation) (Chrome tested).
这意味着,任何支持复制/剪切的浏览器很可能只会根据用户操作执行此操作。例如:即时调用复制命令将不起作用,但是如果绑定到点击事件,它仍然有效,即使该事件没有被阻止(例如导航)(Chrome 测试)。
And here is some interesting article from Google, describing also the Selection API: https://developers.google.com/web/updates/2015/04/cut-and-copy-commands
这是来自谷歌的一些有趣的文章,还描述了选择 API:https: //developers.google.com/web/updates/2015/04/cut-and-copy-commands
BTW: Of course you could preselect the text and ask user to click CTRL+Cbut you lose user-experience.
顺便说一句:当然,您可以预先选择文本并要求用户单击CTRL+,C但您会失去用户体验。
回答by Zaheer Ahmed
For security reasons most browsers do not allow to modify the clipboard (except IE).
出于安全原因,大多数浏览器不允许修改剪贴板(IE 除外)。
The only way to make a copy-to-clipboard function cross-browser compatible is to use Flash.
使复制到剪贴板功能跨浏览器兼容的唯一方法是使用 Flash。
For now you can select all the data you want to copy, and ask user to click CTRL+C.
现在,您可以选择要复制的所有数据,并要求用户单击CTRL+ C。
回答by Lingasamy Sakthivel
Here is one way you can do it in IE...
这是您可以在 IE 中执行此操作的一种方法...
<body>
<textarea rows="5" cols="20" wrap="hard" onblur="CopyToClipboard(this)"></textarea>
</body>
<script language="JavaScript">
function CopyToClipboard(text) {
Copied = text.createTextRange();
Copied.execCommand("Copy");
}
</script>