jquery IF/ELSE 语句悬停函数仅在第二次悬停时触发？

Question

我正在使用 JqueryToolTip 为页面 anchor 内的一系列图像设置工具提示的样式和动画。问题是，当工具提示长度超过 30 个字母时，它不会在 div 内垂直居中。所以我编写了这个 jquery 来将 .small 类添加到任何少于 30 个字母的工具提示中。这产生了我想要的效果，除了它只适用于第二次悬停。如何让它在第一次悬停时发生？

我对jquery还是个新手。我假设它与我输入代码的顺序有关，但我无法弄清楚。

$("#loop-wrapper a img").hover(function(){
  var getLength = $(this).attr("alt").length;
  if(getLength < 30){
    $(".tooltip").addClass("small");
  }
  else{
    $(".tooltip").removeClass("small");
  }
}, function (){
  $(".tooltip").removeClass("small");
});

Answer 1

我会重构它以使用 .toggleClass带有一个 switch 参数，以及 .hover 的一个函数参数:

$("#loop-wrapper a img").hover(function () {
    var getLength = $(this).attr("alt").length;
    $(".tooltip").toggleClass("small", (getLength < 30));
});