Javascript 从剪贴板获取内容 document.execCommand('Paste') 失败的问题

2019-10-12 12:09:03 +08:00
 raymanr
<body>
<textarea onfocus="document.execCommand('Paste')"></textarea>
</body>

帮人弄个正则匹配生成表格的小程序 ,
不想写 wpf ,
就用 html 做了 ,
body 就是这样 , 使用 file 协议访问 , chrome76 edge 都试过了 , 希望达到的效果是获取焦点时候就使用剪贴板的内容进行覆盖 , 但是始终不行 , 问题是出在哪里了呢 ?
4025 次点击
所在节点    问与答
11 条回复
rogwan
2019-10-12 12:16:47 +08:00
浏览器为了安全，不支持 js，要用户触发。
nihiue
2019-10-12 12:17:25 +08:00
特权操作只能在特定的事件中触发，你改成 click 试试
cnanyi
2019-10-12 12:31:46 +08:00
paste 操作，只能主动触发，不能从代码调用了
raymanr
2019-10-12 12:36:01 +08:00
@nihiue
@rogwan

<button onclick="document.querySelector('#a').focus();document.execCommand('Paste');">aaa</button>
<textarea id="a"></textarea>

这样 ? 可以获取焦点 , 但是仍然没法 paste , 可以麻烦说具体点吗 ?
codehz
2019-10-12 12:45:19 +08:00
请用新的 api https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API
gIrl1990
2019-10-12 12:54:01 +08:00
@codehz 咋不行。chrome 77 Uncaught (in promise) DOMException
`navigator.clipboard.readText().then`
raymanr
2019-10-12 13:37:25 +08:00
@codehz
chrome 76
navigator.clipboard.readText().then(clipText => document.querySelector("#a").innerText = clipText).catch(err=>{console.log(err)})

抛出个没有细节的
DOMException

这个试过 , 一直不知道为何都会抛出异常 , 所以才想用 execCommand , 结果也搞不好
love
2019-10-12 13:42:29 +08:00
浏览器可以得到用户的剪贴板？那不是太搞笑了吧，比如我经常复制密码，上个网站就能偷去？
raymanr
2019-10-12 14:06:30 +08:00
@love
原来前面几位说的主动触发是这个意思么 ? 虽然 clipboard.readText() 让我也没看明白 , 不过算了.... 还是用 wpf 吧 , 太麻烦了
chosan
2021-01-11 09:28:51 +08:00
navigator.clipboard.readText() 要在 https 下才行，不然 navigator.clipboard 为 undefined，另外也不能通过在控制台执行，它需要页面为 active 状态，在控制台的时候相当于页面 deactive 了，因此可以在控制台输入以下代码，然后快速点击页面内部激活页面：

setTimeout(async () => {
const text = await navigator.clipboard.readText();
console.log(text);
}, 4000);
chosan
2021-01-11 09:30:47 +08:00
参考链接： https://web.dev/async-clipboard/

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/608559

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX