悬停时清除间隔答案

【问题标题】：clear interval on hover悬停时清除间隔
【发布时间】：2011-12-12 18:55:28
【问题描述】：

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

这是我的代码：

    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);
    });

知道我做错了什么吗？

提前致谢

毛罗

【问题讨论】：

标签： jquery setinterval clearinterval

【解决方案1】：

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

试试这个：

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

【讨论】：

太棒了！很高兴我能帮上忙。如果它解决了您的问题，请记住标记为已回答。（我认为您必须在询问后等待 15 分钟）

【解决方案2】：

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

【讨论】：

【解决方案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;
    });

【讨论】：