我的拖放功能不會被觸發

我嘗試在javascrit中拖放，但是我無法觸發我的拖動功能拖放功能。我將這些功能稱爲文檔準備好。但我只能在頁面加載時調用。 ©無法觸發我的活動。謝謝。

<div id="dropZone"></div>

，這是我的職能

$(document).ready(function() { 
     var dropZone = document.getElementById('dropZone'); 
     if (dropZone) { 
      dropZone.addEventListener('dragover', handleDragOver, false); 
      dropZone.addEventListener('drop', handleFileSelect, false); 
      dropZone.addEventListener('dragleave', handleDragLeave, false); 
     } 
    }); 
    function handleFileSelect(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 

     var files = evt.dataTransfer.files; // FileList object. 
     uploadTheFile(evt,"new",files); 
    } 

    function handleDragOver(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 
     evt.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy. 
     var $dragOver = $("#dropZone"); 
     $dragOver.removeClass("article-content-add-new-images"); 
     $dragOver.addClass("article-content-add-new-images-drag"); 

    } 
    function handleDragLeave(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 

     var $dragLeave = $("#dropZone"); 
     $dragLeave.removeClass("article-content-add-new-images-drag"); 
     $dragLeave.addClass("article-content-add-new-images"); 

    }

來源

2017-04-21 Serkan Soydam

uploadTheFile（）丟失您在handleFileSelect functiion –

嘗試增加內容（例如非換空間）的DIV第一，因爲它有現在是0px的高度。它沒有太多的機會被觸發。（樣式紅色背景，以便在允許丟棄的地方可見）。我在代碼中看不到任何錯誤。

<div id="dropZone" style="background:red;">&nbsp;</div>

這是顯示代碼原樣的JSFiddle。

https://jsfiddle.net/6rw6y9Lf/

來源

2017-04-21 12:42:58

稱爲其實我沒有寫CSS代碼在這裏，所以它具有高度和寬度。 –

看我的jsfiddle。該代碼適用於Chrome。 –

我的拖放功能不會被觸發

回答

相關問題