Question

我有这个Jquery

$(function() {
  $('.count_links').hover( function(){
     $(this).addClass("highlight");
   },
   function(){
     $(this).removeClass("highlight");
   });
   $('.count_links').click(function(){
     $('.count_links').not(this).removeClass('highlight');
     $(this).addClass("highlight");
   });
});

但链接类在单击

后永远不会停留

我想要悬停效果和点击效果

Answer 1

当光标离开元素时，您将删除highlight类。

无论是在点击时还是在悬停时添加类都无关紧要，传递给.hover的第二个函数（在鼠标移出时调用）会删除该类。

您可以考虑在点击上添加其他类，例如“已选择”。

Answer 2

如果我明白你想做，我建议那段代码

$(function() {
  $('.count_links').hover( function(){
     $(this).addClass("highlight");
   },
   function(){
     $(this).removeClass("highlight");
   });
   $('.count_links').click(function(){
     $(this).addClass("highlight");
     $(this).unbind('mouseenter mouseleave');
   });
});

单击时取消绑定悬停处理程序

Answer 3

它会停留，但是当你再次悬停时，你会再次移除它。您将需要一种方法来检测您添加类的方式。也许是另一个虚拟课，比如

function(){
  $(this).addClass('highlight click')'
}

然后你可以在悬停中查找它而不是删除它。

Answer 4

将控制台日志添加到两个悬停功能中。您可以在某些浏览器中看到，即使光标仍在项目上，也会多次调用“out”函数。我不确定是什么导致了这种奇怪的行为。

Answer 5

一个非常简单的解决方法是创建以突出显示具有相同CSS样式的类，hover_highlight和click_highlight。使用操作添加和删除关联的类。因此，如果您单击，则添加了click_highlight，悬停操作将不会删除，因为它正在切换hover_highlight。那么你的行为就不会发生冲突。

Answer 6

   $('.count_links').click(function(){
     $(this).siblings().removeClass('highlight');
     $(this).addClass('highlight').unbind('hover');
   });

和2个不同的类更适合突出显示和点击。

为什么不在jQuery中保持突出显示？

6 个答案: