隐藏或显示 div，悬停时销毁功能

Question

我正在尝试取消绑定悬停事件的特定功能。 div 会在页面加载时显示并在 5 秒后淡出，除非 div 悬停在上面。

函数怎么没有被破坏？我试过：.off, destroy

代码：

function fadeOutshowBox (){

    $('#showBox').delay(5000).fadeOut();

}



fadeOutshowBox ();

$('#showBox').hover (function(){

        $(this).unbind(fadeOutshowBox);

});

感谢大家的帮助。

Answer 1

你可以试试

$('#showBox').hover (function(){

        $(this).fadeToggle();

});

你可以看看https://api.jquery.com/unbind/

解除绑定使用解除绑定事件而不是解除绑定函数

Answer 2

fadeOutshowBox 完全没有绑定。解除绑定它不会做任何事情。

这个怎么样：定义函数 fadeOutshowBox，它执行淡出（没有延迟），然后在 setTimeout（或延迟）后调用该函数。同时，如果用户悬停，可以重新定义 fadeOutshowBox 什么都不做。

function fadeOutshowBox() {
    $('#showBox').fadeOut();
}

setTimeout(fadeOutshowBox,5000);

$('#showBox').hover (function(){
    fadeOutshowBox = function(){};
});

我还没有测试过，但我不明白为什么它不起作用。

Answer 3

您不能取消延迟功能，您应该改用setTimeout https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout

Answer 4

如果我没理解错的话，您只想为 div 设置动画，以防它没有悬停 5 秒。

在那种情况下，这应该可以解决问题：

function fadeOutshowBox (){
    return setTimeout(function(){
        $('#showBox').fadeOut();
    }, 5000);
}

var handle = fadeOutshowBox();

$('#showBox').hover(function(){
    clearTimeout(handle);
});

http://jsfiddle.net/axbccfuv/

隐藏或显示 div，悬停时销毁功能

hide or show div, destroy function on hover

jquery

function

hover