在悬停上切换课程？

Question

我写了下面的代码：

$(document).ready(function() { 
    $("#rade_img_map_1335199662212").hover(function() { 
     $("li#rs1").addClass("active"); //Add the active class to the area is hovered 
    }, function() { 
     $("li#rs1").addClass("not-active"); 
    }); 
}); 

问题是，它似乎没有切换悬停类？

但是我怎样才能得到它，以便该类基于悬停和非悬停..切换？

Answer 1

不要悬停出添加不同类只是删除active类

$(document).ready(function(){ 

    $("#rade_img_map_1335199662212").hover(function(){ 

     $("li#rs1").addClass("active"); //Add the active class to the area is hovered 
    }, function() { 
     $("li#rs1").removeClass("active"); 
    }); 

}); 

，或者如果所有元素都是不活动一开始你可能会使用一个函数和toggleClass()方法

$(document).ready(function(){ 

    $("#rade_img_map_1335199662212").hover(function(){ 
     $("li#rs1").toggleClass("active"); //Toggle the active class to the area is hovered 
    }); 

}); 

Answer 2

请尝试如下，

$(document).ready(function() {  
     $("#rade_img_map_1335199662212").hover(function() {  
      $("#rs1") 
      .removeClass("not-active") 
      .addClass("active"); //Add the active class to the area is hovered 
     }, function() { 
      $("#rs1") 
      .removeClass("active"); 
      .addClass("not-active"); 
     });  
    });