使用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

使用toggleClass()來更改班級通常會更好。更妙的是，如果不使用jQuery，只需使用:hover CSS psuedo類就可以做到這一點。

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

則：

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

或

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

Answer 2

我會推薦添加和刪除CSS類。

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

並非所有的瀏覽器都對支持：hover僞選擇，你可以使用addClass()和removeClass()，這將在CSS的#l_ev_men.hover選擇相匹配。

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