悬停子元素时触发HTML5 dragleave
我遇到的问题是，dragleave悬停该元素的子元素时会触发该元素的事件。另外，dragenter在再次将父元素悬停时不会触发。 我做了一个简化的提琴：http : //jsfiddle.net/pimvdb/HU6Mk/1/。 HTML： <div id="drag" draggable="true">drag me</div> <hr> <div id="drop"> drop here <p>child</p> parent </div> 使用以下JavaScript： $('#drop').bind({ dragenter: function() { $(this).addClass('red'); }, dragleave: function() { $(this).removeClass('red'); } }); $('#drag').bind({ dragstart: function(e) { e.allowedEffect = "copy"; e.setData("text/plain", "test"); } }); 应该做的是div在拖曳某物时通过将其下拉为红色来通知用户。这可行，但是如果您拖入p孩子，则将dragleave被发射，而div不再是红色。返回到下拉列表div也不会再次使其变为红色。有必要将其完全移出下拉菜单div，然后再次拖回下拉菜单以使其变为红色。 dragleave拖动到子元素中时是否可以防止触发？ 2017更新： TL; DR，pointer-events: none;按照下面@HD的回答中所述查找CSS ，该CSS 在现代浏览器和IE11中均有效。