Javascript没有做任何事情

Question

我不知道拖放，看了很多教程和问题，但仍然当我放下我的笑脸，什么都没有发生。我以为它会起作用，因为它在刚开始的时候起作用。

HTML：

<div id='dragging'></div>
<img draggable ='true' src ="http://img87.imageshack.us/img87/5673/rotatetrans.png" id="smiley"/>

javascript：

var smiley = document.getElementById('smiley');
var dragging = document.getElementById('dragging');
smiley.ondragstart = function(){
  dragging.innerHTML = 'You are dragging!';
};
smiley.ondrop = function(){
  dragging.innerHTML=' ';
};

我也尝试过这样做: javascript：

smiley.addEventListenter('ondrop',dragging.innerHTML=' ');

Answer 1

你读过教程，但似乎没有读到正确的教程。

要触发drop事件，首先必须取消dragover和dragenter事件。没什么可说的，但这应该管用：

document.ondragover = function(e) {
    e.preventDefault();
};
document.ondragenter = function(e) {
    e.preventDefault();
};

就像Patrick在注释中注意到的那样，您必须在拖放区域设置drop事件列表，而不是在拖放元素本身上设置。也可能是document：

document.ondrop = function(e) {
    dragging.innerHTML = ' ';
};

这里是一个关于所有这些胡说八道的文章作者: Peter Paul Koch (警告:提前斥责)。

Answer 2

尝尝这个

dragging.addEventListenter('drop', function() {
    dragging.innerHTML=' Dropped '
}, false);

而不是

smiley.addEventListenter('ondrop',dragging.innerHTML=' ');

addEventListener的第二个参数是一个函数。第三个参数决定是否在冒泡期间捕获该事件。

并且，假设删除操作发生在显示图像的同一个div上。

Answer 3

试着遵循这个w3schools拖放

米基盖伊