jquery：切换元素的mouseover/mouseout类的类，但是如果点击元素内部的类会保留类？

嫌疑人我试图用我自己的善意来这个聪明人！jquery：切换元素的mouseover/mouseout类的类，但是如果点击元素内部的类会保留类？

我正在研究一个jQuery插件函数，当你将鼠标悬停在/ out上时，它将在一个元素上打开/关闭一个类，但是如果你在鼠标悬停之前单击元素内部的元素，如果元素已经有该类徘徊在上前t切换

我试图想出如下：

$.fn.showHover = function(settings) { 
    this.bind('mouseover', function hoverIn(){ 
     if ($(this).hasClass('active') == false) { 
      $(this).addClass('active'); 
      $(this).bind('click', function getFocus(){ 
       $(this).unbind('mouseout', hoverOut); 
      }) 
      $(this).bind('mouseout', function hoverOut(){ 
       $(this).removeClass("active"); 
       $(this).unbind('click', getFocus); 
      }) 
     } 
    }) 
    return this; 
};

...如果你点击前徘徊了主意，删除类和取消绑定点击 - 如果您在悬停之前点击，解除鼠标悬停并且该类永远不会被移除。

很明显（因为我在这里寻求帮助！）它不起作用 - 无论是否在悬停前单击元素内部，该类都会被删除。

有人可以指出为什么它失败，并可能提出一个更好的方法呢？谢谢！

来源

2009-11-23 KyokoHunter

如果通过CSS改变元素的外观是你的目标，一个简单的解决方案是简单地添加另一个选择器，使用不同的名称。

.active_hover, 
.active_click { ... }

然后绑定悬停/ unhover事件添加/删除“active_hover”类，然后单击事件中加入“active_click”级。

来源

2009-11-23 20:24:58 mwcz

简单是最好的！我被具有单一的样式类，以保持相同的风格悬停和点击，而是定义两个选择，一个风格如下的想法突发奇想： .active_hover，.active_click {...} 给人的预期的结果。谢谢！ – KyokoHunter 2009-11-23 20:56:02

你能做到这一点

$(".class").mouseenter(function(){ 
$(this).css("edit css"); // you can use .animate instead of .css if you want 
}); 
$(".class").mouseleave(function(){ 
$(this).removeAttr('style'); 
}); 
$(".class").click(function(){ 
$(this).addClass("setactiveclass"); 
});

所以，当你徘徊，一个内联CSS设置，如果你悬停出由jQuery的设定div中内嵌样式被去除。而如果你点击它。一个艰难的阶级被放在它上面，所以它不会互相干扰。

来源

2014-08-25 09:32:33

jquery：切换元素的mouseover/mouseout类的类，但是如果点击元素内部的类会保留类？

回答

相关问题