CODEWITHSUNDEEP
javascriptjqueryfirefoxdrag-and-drop
Nick
Nick

Reputation: 51

JQuery drag and drop not working in firefox but works in chrome and and IE

        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;
           });

Don't know what is wrong in my code. It is working for Chrome and IE. When Ii drop an image I need to drop it in a div but instead, it opens in a tab.

Upvotes: 0

Views: 772

Answers (2)

Matthew Barnden
Matthew Barnden

Reputation: 538

one thing just looking at your code i think you need to use e instead of event unless you are referencing a event out of the events scope that I cannot see.

Upvotes: 0

epascarello
epascarello

Reputation: 207501

Because you defined event as e, but using window.event. 

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

Upvotes: 1

Related Questions