我希望能够在用户单击时启动真正的粘贴事件。我可以理解这可能是一个安全问题,因为......
以上是底线..
有了这个代码JSFiddle https://jsfiddle.net/Mi_Creativity/8ewhvh6n/
var Copy = document.getElementById('copy'),
Cut = document.getElementById('cut'),
Paste = document.getElementById('paste');
// Checking Clipboard API without an action from the user
console.log('Copy:' + document.queryCommandSupported('copy'));
console.log('Cut:' + document.queryCommandSupported('cut'));
console.log('Paste:' + document.queryCommandSupported('paste'));
//Now checking the clipboard API upon a user action
Copy.addEventListener('click', function(){
console.log('Copy:' + document.queryCommandSupported('copy'));
});
Cut.addEventListener('click', function(){
console.log('Cut:' + document.queryCommandSupported('cut'));
});
Paste.addEventListener('click', function(){
console.log('Paste:' + document.queryCommandSupported('paste'));
});
<button id="copy">Copy</button>
<button id="cut">Cut</button>
<button id="paste">Paste</button>
如果您使用不同的浏览器进行检查,您会发现浏览器在处理剪贴板API http://www.w3.org/TR/clipboard-apis/ using queryCommandSupported()
结果是:
铬47:
- 无需用户操作,复制:
false
, Cut:false
, Past:false
- 通过用户操作,复制:
true
, Cut:true
, 粘贴:false
火狐 43:
- 无需用户操作,复制:
true
, Cut:true
, Past:false
- 通过用户操作,复制:
true
, Cut:true
, 粘贴:false
IE11: - 我相信Edge也是一样
- 无需用户操作,复制:
true
, Cut:true
, Past:true
- 通过用户操作,复制:
true
, Cut:true
, 粘贴:true
- 虽然所有选项均正确,但 IE 会要求用户获得对上述所有操作的许可。
Safari: - iOS Safari 也一样
- 仅在有效选择上触发复制事件,并且仅在聚焦的可编辑字段中剪切和粘贴。
- 操作系统剪贴板只能通过快捷键读写,不能通过
document.execCommand()
.
有关剪贴板 API 的详细浏览器支持caniuse.com/#search=clip http://caniuse.com/#search=clip
浏览器还支持使用右键单击上下文菜单进行粘贴conteneditable="true"
像这样的元素JS 小提琴 2 https://jsfiddle.net/Mi_Creativity/36vv156n/2/
但例如在 google 文档(在类似 word 的应用程序中)中,我可以从自定义上下文菜单粘贴(右键单击假装为上下文菜单的 html 元素),即使剪贴板数据已以不同的方式复制到剪贴板像微软画图这样的应用程序。
我以为他们使用闪光灯来做到这一点,但即使我在 Chrome 中完全禁用闪光灯,它仍然有效。
From 用于开发 Google Apps 插件的 Google Apps 脚本文档 https://developers.google.com/apps-script/add-ons/:
"该平台:Apps 脚本代码编辑器是一个网络应用程序,您可以从 Google 表格、文档或表单中启动。该语言基于 JavaScript,but executes on Google's servers rather than directly in the user's browser
(客户端用户界面除外......".
由于它是在他们的服务器上执行的,我认为他们可以启用某些功能,甚至使用 Java,以获得更好的体验。
EDIT 1:
如果你检查剪贴板.js https://zenorocha.github.io/clipboard.js/,您会看到该库没有“粘贴”选项,只有“复制”和“剪切”选项,也在“浏览器支持在页面末尾的“部分,您将看到该库依赖于执行命令 https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommandAPI,在 Safari 中不起作用。
EDIT 2:
Upon an update of the question as well as comments, for the Google docs part, I pressed Prt Sc to have a screen-shot in the clipboard, opened Google docs in Chrome, right-clicked then clicked on "Paste" from the custom context menu and for sure it works, opened Google docs in Firefox and as soon I clicked on "paste" option I got this response https://i.stack.imgur.com/AMCRA.png
另外郑重声明,我尝试在 IE11 中执行相同操作,但自 21 分钟以来它仍在尝试启动 Google 文档。
所以结论很可能是,而且大部分是,“Google“ Chrome 有一个例外: - 类似条件语句的东西 - for "Google“我认为他们的浏览器中的文档和其他谷歌服务@朱利安·格雷瓜尔 https://stackoverflow.com/users/4867993/julien-gr%C3%A9goire关于它是 Firefox 的扩展是正确的。
From 此 Google 文档支持页面 https://support.google.com/docs/answer/161768?hl=en:
出于安全原因,大多数浏览器不允许文档、表格和幻灯片等网络应用程序通过菜单使用计算机的剪贴板。
但是,如果您使用 Chrome,则可以通过安装 Google Drive Chrome 应用程序来授予访问剪贴板的权限。这允许您使用右键单击菜单复制和粘贴内容(或从工具栏的编辑菜单中选择“复制”或“粘贴”)。要安装该应用程序,请访问 Chrome 网上应用店。
And 这个小型企业页面 http://smallbusiness.chron.com/copy-paste-google-docs-not-working-53088.html:
如果没有键盘快捷键,您还有两个复制和粘贴选项:转到“编辑”菜单并选择“复制”或“粘贴”,或者右键单击文档并选择“复制”或“粘贴”上下文菜单。在 Google 文档中,这两个选项仅适用于安装了 Google Drive Web 应用的 Chrome 用户。该应用程序是免费的,但不适用于其他浏览器。
看来他们已经将该应用程序作为内置功能实现在较新版本的 Chrome 中。