Question

我有一个图像库，它有前一个和下一个按钮。因此，为了使图像更改，我编写了一个函数，该函数不断点击下一个按钮来更改图像。

function infiniteLoop(time){
    function f(){
        $('.image-nav-next').click() // click the next button
        timer = setTimeout(f, time)
    }
    f();
}

这对我来说很好。但现在我想在图像悬停上暂停点击事件。这意味着，当用户在图库中的图像上悬停时，只要鼠标位于该图像上，它就应该显示相同的图像。当用户从图像中移除光标时，库将再次开始工作并像以前一样更改图像。我尝试了以下内容 -

$('.myimg').mouseover(function(){         
    $('.image-nav-next').unbind('click');
});

然后

$('.myimg').mouseout(function(){          
    $('.image-nav-next').bind('click');
});

Unbind工作正常，但重新绑定不起作用。有什么想法吗？

Answer 1

你走错了路。

相反，您需要做的是清除鼠标上的计时器clearTimeout(timer)，鼠标离开后，您可以再次通过调用infiniteLoop来计划循环

取消绑定并绑定点击事件

1 个答案: