JQuery 拖放在 Firefox 中不起作用，但在 chrome 和 IE 中起作用答案

【问题标题】：JQuery drag and drop not working in firefox but works in chrome and and IEJQuery 拖放在 Firefox 中不起作用，但在 chrome 和 IE 中起作用
【发布时间】：2017-05-25 13:20:36
【问题描述】：

        jQuery("#image-div").on('dragleave',function(e){
            document.getElementById("image-div").style.borderColor = "#E6E6E6";
            return false;
           });
        jQuery("#image-div").on('dragover',function(e){
            document.getElementById("image-div").style.borderColor = "#9B9999";
            return false;
           });
        jQuery("#image-div").on('drop',function(e){
            event.preventDefault && event.preventDefault();
            var files = event.dataTransfer.files[0];
            if (files.type.match("image.*"))
            {
            var fileReader = new FileReader();
            fileReader.onload = function (event)
            {
                uploadImage(event.target.result);
            }
            fileReader.readAsDataURL(files);
            } 
            return false;
           });

不知道我的代码有什么问题。它适用于 Chrome 和 IE。当我放置图像时，我需要将其放置在 div 中，但它会在选项卡中打开。

【问题讨论】：

标签： javascript jquery firefox drag-and-drop

【解决方案1】：

因为您将事件定义为 e，但使用的是 window.event。

 jQuery("#image-div").on('drop',function(e){ <-- e
   event.preventDefault && event.preventDefault(); <-event

【讨论】：

非常感谢......它正在开始加载，现在它显示“event.dataTransfer”未定义
您将function(e) 调整为function(event)？
var files = event.target.files || (event.dataTransfer && event.dataTransfer.files);
我不知道拖放，所以我无法帮助你，那是在黑暗中刺伤。我刚刚发现了您使用错误的变量引用时遇到的大错误。
developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/… 使用他们在 MDN 上的内容。

【解决方案2】：

仅查看您的代码的一件事我认为您需要使用 e 而不是 event 除非您引用的事件超出了我看不到的事件范围。

【讨论】：

将代码更改为 e 但现在它在 chrome 中也不起作用