Question

我正在尝试这样做，以便当您将图像从文件或互联网拖动到放置区域时，它会在页面上生成图像，然后拍摄该图像的SRC。这似乎很容易，但我已经浏览了整个互联网并且无法弄清楚这一点。 Chrome会抛出错误：

'找不到与提供的签名相匹配的功能。

<!doctype html>
<html>

<head>
  <script>
    function dropHandler(ev) {
      ev.preventDefault();
      img = new Image();
      fileTransferred = ev.dataTransfer.items[0];
      img.src = window.URL.createObjectURL(ev.dataTransfer.items[0]);
      ev.dataTransfer.items.clear();
      ev.dataTransfer.clearData();
      window.URL.revokeObjectURL(img.src);
    }

    function dragOverHandler(ev) {
      ev.preventDefault();
    }
  </script>
</head>

<body>
  <div id="drop_zone" ondrop="dropHandler(event);" ondragover="dragOverHandler(event);">
    <p>Drag a picture here.</p>
  </div>
</body>

</html>

为什么这不起作用？

Answer 1

经过一些检查后，我发现你应该让它表现为文件，而不是项目。显示此内容的演示为 here.

JS

function dropHandler(ev) {
    ev.preventDefault();
    img = new Image();
    fileTransferred = ev.dataTransfer.files[0];
    img.src = window.URL.createObjectURL(fileTransferred);
    ev.dataTransfer.items.clear();
    ev.dataTransfer.clearData();
    window.URL.revokeObjectURL(img.src);
  alert(img.src);
}

function dragOverHandler(ev) {
    ev.preventDefault();
}

'没有找到与拖放提供的签名相匹配的功能

1 个答案: