与单击并悬停动画Jquery冲突

我的jQuery代码有点问题

这是我的密码：

$("#bloc-search").click(function(){
        $(this).toggleClass("bloc-search-highlight");
        //var jObj = $( this );
});

if ( $("#formulaire-search").is(':visible')){   

    $('.search').attr('src', '/img/search-blanc.png');

} else {

    $("#bloc-search").hover(
        function(){
           $('.search').attr('src', '/img/search-blanc.png');
        }, function(){
           $('.search').attr('src', '/img/search-blue.png');
    });

}

它工作得几乎完美，但我的问题是，当我的#公式搜索可见时，悬停函数仍在工作，我不知道为什么，因为在我的if中，我没有悬停函数。 我还尝试了hasClass而不是visible no way

一个主意

谢谢你的帮助；-）

您可以尝试以下方法：

if ( $("#formulaire-search").is(':visible')){
  $("#bloc-search").unbind('mouseenter mouseleave');
  ... other stuff ...
} else {
  $("#bloc-search").bind('mouseenter mouseleave'); // to be sure
  ... other stuff ...
}

当您需要悬停功能时，可能需要重新绑定它

更新

这是正常工作的-使用

mouseenter

和

mouseleave

可以很好地工作，也可以很容易地在本地工作

if ( $("#formulaire-search").is(':visible')){   

    $('.search').attr('src', '/img/search-blanc.png');

} else {

    // do what you want here - only works when #formulaire-search not visible     
    $("#bloc-search").on('mouseenter', function(){
           $(this).addClass('goTeal');
    });

    $("#bloc-search").on('mouseleave', function(){
           $(this).removeClass('goTeal');
    });

}

---

谢谢您的回答，但它仍然不起作用。即使有你的想法：

if（$（“：formulaire search”）.is（'：visible'）{$（“$”bloc search”）.unbind（'mouseenter mouseleave'）；$（'search'）.attr（'src'，'/img/search blanc.png'））}else（$（'bloc search'）.bind（'mouseenter mouseleave'）；$（'bloc search'））。hover（'function（）（'src'）（'search'）.attr'）（'src'，'/img/search blanc.png'）；}，function（）{$（'search'）.attr（'src'，'/img/search blue.png'）；}}

Hi Darren，我尝试了你的更新（mouseenter，mouseleave），但它仍然不工作。我不知道为什么mouseenter和mouseleave仍然处于活动状态，而div是可见的：-（你看了我做的小提琴了吗？应该是这样的，如果你的没有，那么我怀疑是其他原因导致它失败了-有没有控制台错误？我检查了你的小提琴，在不同的计算机和浏览器上没有动画。我的控制台没有错误。