Question

这是一个小提琴：https://jsfiddle.net/u1a4j3br/1/

我在这里有一种非常奇怪的行为。尝试将鼠标悬停在红色方块上，然后将鼠标移动到右侧，方块扩展到。现在执行一次单击，您将看到，悬停状态正在被删除，并在半秒后添加，因此它将为其他悬停做好准备。如果您在普通的浏览器（如Chrome，Opera，FF等）中尝试此功能，即使您的鼠标在0.5秒内没有移动也能正常工作。

现在，在IE中尝试相同的操作。你会看到，它在鼠标移动时也有效，但是，当鼠标没有被移动时，它将不起作用。在这种情况下，0.5秒后，方块会直接跳回到悬停状态。

这是我为测试目的设置的受影响的div：

<div id="myDiv" class="test" onclick="removeHover()"></div>

这是＆＃34;测试＆＃34; -class：

的css

.test{
    height:100px;
    width: 100px;
    background: red;
}

function removeHover(){

    $('.test').addClass('nohover');

    setTimeout(function(){
        $('.test').removeClass('nohover');
    },50);

}

实际上应该压制行为，因为它同时隐藏了div的悬停部分，因为我想要无所事事，并且通过从鼠标下方拉动div来中断短时间的悬停（所以基本上与通常将鼠标拉离div一样）与一些css悬停操作一起玩：

.test:not(.nohover):hover{
    width:400px;
    background: yellow;
}

请注意.nohover不是css类，它只是阻止悬停事件的一些占位符。

我怀疑IE只会在鼠标移动后更新可能的悬停状态。显然它不能真正成为JQuery，因为它实际上正在发挥作用。

有没有办法强制它更新，以防止这种行为？（关于如何在这里找到鼠标问题的一些想法也可能有所帮助）

到目前为止，我只想在再次删除课程之前等待鼠标移动，但我希望有更优雅的方法来做到这一点。

编辑：Here是我的想法的解决方案。这实际上是通过添加一个mousemove处理程序来实现的，该处理程序在第一次鼠标移动时删除了类，然后取消绑定了侦听器，但我并不喜欢它。希望更接近我的第一种方法，超时。我不喜欢依赖鼠标事件。

当鼠标静止时，IE在jquery add / remove class之后不更新悬停状态

0 个答案: