Question

我正在使用'dragstart'，'dragleave'事件在浏览器上拖动事件。当只添加一个width属性时，Internet Explorer 11中的行为会有很大差异。只要为元素指定了width属性，dragLeave事件就会开始触发，如果没有它，则不会。有人可以解释为什么仅仅因为宽度属性而观察到两种不同的行为。在IE11中可以观察到这个问题。

以下是两个仅在CSS中有所不同的jsFiddles：https://jsfiddle.net/fb5sp5yc/1 https://jsfiddle.net/f3ap2242/3。在其他浏览器（Chrome，Firefox）中，所有内容都会按预期启动。

HTML正文：

<div id="d" draggable="true">MoveInMoveOut</div><br>
<div id="s" draggable="true">DragMe</div>
<select id=oResults size=30>
    <option>List of Events Fired
</select>

JS代码：

function ShowResults() { 
    var oNewOption = new Option(); 
    oNewOption.text = event.type + "  fired by  " + event.srcElement.id;
    oResults.add(oNewOption,0);
}

var myDiv = document.getElementById("d");
myDiv.addEventListener('dragenter', ShowResults, false);
myDiv.addEventListener('dragleave', ShowResults, false);

CSS：

#s {
    background-color: red;
    width: 200px; /*Only this property changes*/
}

#d {
    background-color: yellow;
    width: 200px; /*Only this property changes*/
}

Answer 1

在Chrome中，如果s和d的宽度大于元素的宽度，则会有一个默认的溢出属性，但IE默认情况下不会发生。我试着给予

#oResults{ overflow:visible; }

它对我来说很好，请尝试包含这个并在IE中测试。

dragLeave事件在浏览器

1 个答案: