在悬停时切换类？ [英] toggle class on hover?

问题描述

我写了以下代码：

$(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");
    });
});

问题是它似乎没有在悬停时切换班级？

The problem is it doesnt seem to toggle the class on hover?

但我怎样才能让它根据悬停和非悬停来切换..？

But how can i get it so that the class toggles based on hover and non-hover..?

推荐答案

不要在悬停时添加其他类只需删除有效类

Do not add a different class on hover-out just remove the active class

$(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（） 方法

or if all elements are inactive at first you could use a single function and the toggleClass() method

$(document).ready(function(){

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

});

这篇关于在悬停时切换类？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！