Question

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

为什么功能没有被破坏？我试过：.off，destroy

代码：

function fadeOutshowBox (){

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

}



fadeOutshowBox ();

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

        $(this).unbind(fadeOutshowBox);

});

感谢您的帮助。

Answer 1

如果我理解正确，你只想动画div，以免它被徘徊5秒钟。

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

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

var handle = fadeOutshowBox();

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

http://jsfiddle.net/axbccfuv/

Answer 2

你可以尝试

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

        $(this).fadeToggle();

});

您可以查看https://api.jquery.com/unbind/

取消绑定使用unbind事件而不解除绑定功能

Answer 3

fadeOutshowBox根本没有绑定。取消绑定它没有做任何事情。

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

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

setTimeout(fadeOutshowBox,5000);

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

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

Answer 4

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

隐藏或显示div，在悬停时破坏功能

4 个答案: