如何使用jQuery的drop事件上传从桌面拖拽的文件？
如何使用jQuery的drop事件上传从桌面拖拽的文件？
提问于 2012-03-03 17:32:45
可以使用jQuery的drop事件从桌面拖拽文件吗？
如果是，我如何获取丢弃的文件数据？
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-03-03 17:43:20
这有点麻烦(你至少需要处理3个事件)，但还是有可能的。
首先，您需要为dragover和dragenter添加eventhandlers，并阻止这些事件的默认操作：
$('#div').on(
'dragover',
function(e) {
e.preventDefault();
e.stopPropagation();
}
)
$('#div').on(
'dragenter',
function(e) {
e.preventDefault();
e.stopPropagation();
}
)在这些事件上调用preventDefault实际上很重要，否则，一些浏览器可能永远不会触发drop事件。
然后，您可以添加拖放处理程序并使用e.originalEvent.dataTransfer.files访问拖放的文件
$('#div').on(
'drop',
function(e){
if(e.originalEvent.dataTransfer && e.originalEvent.dataTransfer.files.length) {
e.preventDefault();
e.stopPropagation();
/*UPLOAD FILES HERE*/
upload(e.originalEvent.dataTransfer.files);
}
}
);现在，您可以从桌面/explorer/finder中的div中拖动文件并访问它们。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9544977
复制相关文章
相似问题