Question

鼠标悬停时我使用此代码突出显示我的按钮：

$("#fileupload").mouseenter(function () {
    $("#myLink").css("background-color", "#495461");
}).mouseleave(function () {
    $("#myLink").css("background-color", "#3C454F");
});

它可以工作但是当点击这个按钮时（鼠标悬停）会显示一个模态窗口来选择文件，因此在这个cas中，mouseleave永远不会继续。

我的问题：当显示此模式时，如何修复此问题以使背景颜色恢复为“正常”（＃3C454F）。我更喜欢避免在单击此按钮后放置一些代码，但是将所有内容集中在上面的一组代码中，因为这里我简化了问题......

Answer 1

这应该用CSS和:hover伪类来完成。

只需将此CSS规则添加到您的样式中即可。

#myLink {
  background-color:  #495461;
}

#myLink:hover {
  background-color:  #3C454F;
}

Answer 2

只需使用.hover（）：

$("#fileupload").hover(
    function () {
        $("#myLink").css("background-color", "#495461");
    },
    function () {
        $("#myLink").css("background-color", "#3C454F");
    }
);

jQuery Documention for .hover()

Answer 3

使用JQuery hover代替，它应该可以工作。

你的代码应该是：

$("#fileupload").hover(
    function () {
        $("#myLink").css("background-color", "#495461");
    },
    function () {
        $("#myLink").css("background-color", "#3C454F");
    }
);

Answer 4

从$("#fileupload').mouseleave到$("#myLink").click事件

添加相同的行为

Answer 5

您的代码工作正常。

只是您使用的颜色未被清楚地识别出来。 #495461和#3C454F以相同的阴影显示

检查fiddle demo

当我的按钮悬停时，并不总是触发mouseleave

5 个答案: