我需要模拟用户将图像拖放到文件上传div。我将从aws s3 bucket 中提取图像。
This question 介绍了如何模拟事件。但是，drop 是通过在 dropzone div 上调用 .drop() 事件来完成的。
但是，就我而言，代码将在由 Chrome 扩展程序注入的 content script 中运行。这意味着，afaik，我无法在页面的 dropzone div 上调用 drop() 方法。
还有其他方法可以模拟drag-and-drop 函数吗？
如果重要的话，我正在处理的页面似乎正在使用jQuery UI ddmanager 来控制其文件放置区div。
【问题讨论】：
标签： javascript jquery google-chrome-extension drag-and-drop
您可能想检查并尝试Passing multiple files with drag and drop 中给出的现有拖放代码示例，其中您实际上可以将一个或多个文件从桌面拖放到浏览器。
<div id=”dropzone”></div>
var dropzone = document.getElementById('dropzone');
dropzone.ondrop = function(e) {
var length = e.dataTransfer.files.length;
for (var i = 0; i < length; i++) {
var file = e.dataTransfer.files[i];
... // do whatever you want
}
};
但是，它还指出，当您尝试传递文件夹时，请注意它将被拒绝或视为 File 对象，从而导致失败。对于文件夹，您需要更改处理拖放对象的方式。
您可能还想阅读 Exploring the FileSystem APIs 以了解有关 FileSystem API 以及新拖放功能的更多信息，请阅读此 document。
最后，这些 GitHub 帖子也可能有所帮助：
【讨论】：