Question

起初，我试图这样做：将鼠标悬停在div元素上会改变背景颜色。我用简单的CSS做到了这一点。它在Chrome和我检查过的早期IE版本中有效。但是使用IE 11，当我的鼠标离开div时，悬停的背景颜色仍然存在。

然后我使用jQuery，在悬停时，在悬停时添加一个类并在mouseleave上删除该类（在CSS文件中我将悬停背景颜色与此类关联）。我使用console.log来检查它是否在这些部分中，并且它们在那里，但是removeClass（'class-name'）实际上并没有因为某种原因在IE 11中删除该类。

我也尝试使用setClass和classList.remove / add，但无法删除添加的类。尽管console.log显示我在代码中就是这样做的。

然后我试着，而不是添加/删除一个类，只是直接用jQuery中的悬停事件更改背景颜色，比如$（'div.target'）。css（'background-color'，'color' ）。这前两次工作。在悬停时，它变为悬停背景颜色，然后离开，它变为另一种颜色。但是我不能再次盘旋在div上以让悬停颜色回来。

有关可能导致这些问题的怪癖的任何提示或知识？

Answer 1

以下代码段使用JQuery mouseleave和mouseenter来执行background-color更改。适用于IE 9 +。

JSFiddle

<强> HTML

<div class="myDiv myDiv-red">

</div>

<强> CSS .myDiv { 身高：30px; 宽度：30px; }

.myDiv-red
{
    background-color : red;
}

.myDiv-green
{
    background-color : green;
}

<强> JQuery的

$(function() {
    $(".myDiv").mouseenter(function() {
       $(this).removeClass("myDiv-red").addClass("myDiv-green");
    });

    $(".myDiv").mouseleave(function() {
       $(this).removeClass("myDiv-green").addClass("myDiv-red"); 
    });
});

背景颜色粘在Internet Explorer 11中

1 个答案: