Question

Google文档支持将图像文件粘贴到文档中。也就是说，您的桌面上有一个图像文件，然后复制该文件，然后按Ctrl + V组合到Google文档中。它如何捕获此粘贴？

此代码可从粘贴中捕获文本和图像（而非文件）。

document.addEventListener('paste', function(e) {
    console.log(e)
    console.log(e.clipboardData.items.length)
    for (var item of e.clipboardData.items) {
        console.log(item)
    }

    console.log(e.clipboardData.files.length)
    for (var file of e.clipboardData.files) {
        console.log(file)
    }
});

输出：

文本https://i.imgur.com/B3hpQAd.png

图片https://i.imgur.com/3XklRHn.png

从桌面复制的图像文件：https://i.imgur.com/7Vv1aTW.png

Answer 1

他们可能会监听paste事件，ClipboardEvent，因此具有clipboardData属性，它是DataTransfer对象，您可以从中访问其files属性。

inp.onpaste = e => {
  e.preventDefault();
  const files = e.clipboardData.files;
  if (files && files.length && !files[0].type.indexOf('image')) {
    var img = document.body.appendChild(new Image());
    img.src = URL.createObjectURL(files[0]);
  }
}

<input id="inp" placeholder="paste an image file here">

捕获粘贴的文件

1 个答案: