php - jQuery 'on' 事件，检查是否未开启

Question

POSTED我有一个正在运行的事件，使用 on 事件检查我是否将链接悬停在某事之后。

$(document).on("mouseenter","#hover",function() {
    load(); 

    $("#sidebar").fadeToggle("slow");
    $("#sidebar").html('');

    $.post("ajax_search.php?type=sidebar", { sidebar : $("#search").val() }, function(get_data) {
        stop_load();

        $("#sidebar").html(get_data);
    });
});

问题

我怎样才能让它在你停止悬停#hover时#sidebar隐藏起来？我正在发布#hover，这就是我使用该ON事件的原因。

有偶数notOn吗？

谢谢！

Answer 1

不，没有notOn。

但是有一个对应的mouseenter: mouseleave。

$(document).on("mouseenter","#hover",function() {
    $("#sidebar").fadeToggle("slow");
});

Answer 2

您正在寻找的是一个悬停事件，它允许您使用两个事件处理程序，一个是鼠标进入，另一个是鼠标离开，

另一种完成它的方法是

$(".selector").on(
{
mouseenter: function() 
{
    //stuff to do on mouseover
},
mouseleave: function()
{
    //stuff to do on mouseleave
}
});

Answer 3

尝试使用 mouseleave 事件：

$(document).on("mouseleave","#hover",function() {
      //Code required to hide the sidebar.
 });

您可能还想考虑延迟执行您的 ajax 调用，缓存结果，并确保它只加载一次。

另外，不要依赖 Toggle 的方法。我会在 mouseenter 和 mouseleave 上显式使用fadeIn 和fadeOut，以防事件解决的顺序变得滞后。

Answer 4

没有notOn方法。但在以下示例中，该mouseout函数的行为将与notOn您要查找的一样。这是一个例子：

$('#hover').on({
    mouseenter: function(){
        // perform operations when you're hovering on #hover element
        $('#sidebar').fadeIn();
    },
    mouseout: function(){
        // perform operations when you stop hovering over #hover element    
        $('#sidebar').fadeOut();    
    }
});