获取当前剪贴板内容?

我想知道一种方法,使我的脚本检测剪贴板的内容,并粘贴到一个文本字段时,页面打开,没有来自用户的输入。怎样才能做到呢?

264399 次浏览

window.clipboardData.getData('Text')可以在某些浏览器中工作。然而,许多浏览器在它的工作将提示用户是否他们希望该网页可以访问剪贴板。

你可以用

window.clipboardData.getData('Text')

在 IE 中获取用户剪贴板的内容。但是,在其他浏览器中,您可能需要使用 flash 来获取内容,因为没有标准的界面来访问剪贴板。也许你可以试试这个插件 零剪贴板

下面将提供所选内容以及更新剪贴板。

用复制事件绑定元素 id,然后获取选定的文本。您可以替换或修改文本。获取剪贴板并设置新的文本。要获得确切的格式,您需要将类型设置为“ text/html”。您还可以将其绑定到文档而不是元素。

document.querySelector('element').bind('copy', function(event) {
var selectedText = window.getSelection().toString();
selectedText = selectedText.replace(/\u200B/g, "");


clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
clipboardData.setData('text/html', selectedText);


event.preventDefault();
});

使用 新的剪贴板应用程序接口,通过 navigator.clipboard。它可以这样使用:

异步/等待语法:

const text = await navigator.clipboard.readText();

或者使用“承诺”语法:

navigator.clipboard.readText()
.then(text => {
console.log('Pasted content: ', text);
})
.catch(err => {
console.error('Failed to read clipboard contents: ', err);
});

请记住,这将提示用户使用权限请求对话框,因此不可能有任何有趣的业务。

如果从控制台调用,上面的代码将无法工作。它只有在活动选项卡中运行代码时才能工作。要从控制台运行代码,您可以设置一个超时并快速点击网站窗口:

setTimeout(async () => {
const text = await navigator.clipboard.readText();
console.log(text);
}, 2000);

阅读更多关于 谷歌开发者文档中的 API 和用法的内容。

规格