我正在HTML5中进行拖放操作，但我注意到drop事件没有触发。
我尝试并注意到dragstart，dragenter，draftover引发了所有此事件（我创建了console.log输出进行检查）
function alerteMoi(){
continent = document.getElementById("afrique");
droite = document.getElementById("droite");
continent.addEventListener("dragstart", startDrag, false);
droite.addEventListener("dragenter", function(e){e.preventDefault, false});
droite.addEventListener("dragover", function(e){e.preventDefault, false});
droite.addEventListener("drop", dropped, false);
}
function startDrag(e){
console.log(continent);
e.dataTransfer.setData("Text", continent);
}
function dropped(e){
//Cannot log this event, it means that the dropped event is not firing
console.log(droite);
e.preventDefault();
droite.innerHTML = e.dataTransfer.getData("continent");
}
window.addEventListener('load', alerteMoi, false);#gauche{
float: left;
height: auto;
width: 48%;
border: 1px solid red;
}
#droite{
float: right;
height: 100px;
width: 44%;
border: 1px solid blue;
}<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="style.css"/>
<script src="script.js"></script>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<ul id="gauche">
<li draggable="true" id="afrique">Afrique</li>
<li>Amerique</li>
<li onclick="alert('Azie !');">Azie</li>
<li>Europe</li>
<li onclick="alert('Oceanie !');">Oceanie</li>
</ul>
<div id="droite">
<ul><li>Monde</li></ul>
</div>
<img src="ex.png" alt="title"/>
</body>
</html>preventDefault是一种方法，因此应在其名称后加上括号：e.preventDefault()。还有一种“错别字”，因为false没有作为属性传递给addEventListener()方法，而是在dragover函数中被exected传递。
更改
droite.addEventListener("dragenter", function(e){e.preventDefault, false});
droite.addEventListener("dragover", function(e){e.preventDefault, false});
for
droite.addEventListener("dragenter", function(e){e.preventDefault()}, false);
droite.addEventListener("dragover", function(e){e.preventDefault()}, false);
而且您应该会很好。