jquery - 悬停时清除间隔

Question

有一个定制的滑块，我想在悬停时停止。我试图清除并设置悬停间隔，但无法正常工作。它仅在我第一次悬停在它上面时停止，然后如果我将鼠标移出并再次移入它不会停止。

这是我的代码：

    var itvl = null;

    itvl = window.setInterval(function(){scroll_()},3000);

    function scroll_() {
        if ($('#carousel_ul li').length > 1) {
            $("#right_scroll").click();
        }
    }

    $('#carousel_ul li').hover(function() {
        window.clearInterval(itvl);    
    }, function() {
        window.setInterval(function(){scroll_()},3000);
    });

知道我在做什么错吗？

提前致谢

毛罗

Answer 1

当您在悬停时设置间隔时，您没有设置 itvl。itvl 实际上是一个整数，用作对区间的引用。因此，当您不参考任何内容时，参考会发生变化window.setInterval(function(){scroll_()},3000);。

试试这个：

$('#carousel_ul li').hover(function() {
    window.clearInterval(itvl);    
}, function() {
    itvl = window.setInterval(function(){scroll_()},3000);
});

Answer 2

$('#carousel_ul li').hover(function() {
    window.clearInterval(itvl);    
}, function() {
    itvl = window.setInterval(function(){scroll_()},3000);
});

Answer 3

您可以使用布尔变量而不是 clearInterval：

    var scrolling= true;    
    window.setInterval(scroll_,3000);    
    function scroll_() {
        if(scrolling) {
            if ($('#carousel_ul li').length > 1) {
               $("#right_scroll").click();
            }
        }
    }    
    $('#carousel_ul li').hover(function() {
        scrolling = false;    
    }, function() {
        scrolling = true;
    });