jquery - 使用 JQuery 返回默认颜色

Question

我有一个下拉菜单，我正在使用mouseenter()功能。如果鼠标进入我的选择器区域，背景颜色将返回黄色。但是如果我离开我的选择器区域，我想在不使用mouseleave()函数的情况下设置选择器区域的默认颜色。

我该如何解决？

$(document).ready(function(){
    $("#l_ev_men").mouseenter(function(){
        $(this).css("background-color","yellow");
        $(this).css("color","black");
    });

    $("#l_ev_men").mouseleave(function(){ // ı dont want to use this function
    });
});

Answer 1

我建议添加和删除 CSS 类。

#l_ev_men:hover, #l_ev_men.hover {
     color: black;
     background-color: yellow;    
}

并非所有浏览器都支持 :hover 伪选择器，您可以使用addClass()and removeClass()，这将匹配#l_ev_men.hoverCSS 上的选择器。

$("#l_ev_men").hover(
    function in(){ 
         $(this).addClass("hover"); 
    }, 
    function out(){ 
         $(this).removeClass("hover");  
    }
);

Answer 2

通常最好使用toggleClass(). 更好的是，您可以在不使用 jquery 的情况下仅使用:hoverCSS psuedo 类来做这么简单的事情。

.hoverable:hover {
    background-color:yellow;
    color:black;
}

然后：

<li class="hoverable <otherstuff>">...</li>...

或者

<td class="hoverable <otherstuff>">...</td>...