当我拖放文本时,没有任何反应。但是当我将事件更改为“dragenter”或“dragleave”时,相同的脚本会起作用。我错过了什么吗?
function handleDragDrop(e) {
console.log("Something droped");
dropStatus.innerHTML = "Something droped";
}
var dropZone = document.getElementById("dropZone");
var dropStatus = document.getElementById("dropStatus");
dropZone.addEventListener("drop", handleDragDrop);
.drop-zone {
width: 300px;
padding: 20px;
border: 2px dashed #000;
}
<div id="dropZone" class="drop-zone">Drop Zone!</div>
<div id="dropStatus"></div>
<div class="" draggable="true">DRAG ME</div>
最佳答案
需要取消结束
function handleDragDrop(e) {
console.log("Something droped");
dropStatus.innerHTML = "Something droped";
}
var dropZone = document.getElementById("dropZone");
var dropStatus = document.getElementById("dropStatus");
dropZone.addEventListener("drop", handleDragDrop);
dropZone.addEventListener("dragover", function(e) {
e.preventDefault();
return false;
});
.drop-zone {
width: 300px;
padding: 20px;
border: 2px dashed #000;
}
<div id="dropZone" class="drop-zone">Drop Zone!</div>
<div id="dropStatus"></div>
<div class="" draggable="true">DRAG ME</div>
关于javascript - drop EventListener 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41863210/