如何退出 jquery 中定义的 setInterval 函数

Question

我有这个 JavaScript 代码：

        var step = 8;                 // How many pixels to move per step
        var current = -1920;            // The current pixel row
        var imageWidth = 1920;        // Background image width
        var headerWidth = 960;        // How wide the header is.

        function slide_in(){
            //Go to next pixel row.
            current += step;

            //Set the CSS of the header.
            $('#bgfade').css("background-position",current+"px 0");

            if(current==0) alert('stop');
        }

        //Calls the scrolling function repeatedly
        $('#bgfade').click(function(){        
            var init = setInterval("slide_in()", 1);
        });

这使得背景幻灯片。我想在 var current = 0 时退出，并让背景处于该位置。

谢谢

Answer 1

您需要使用 clearInterval()，例如this：

var step = 8;                 // How many pixels to move per step
var current = -1920;            // The current pixel row
var imageWidth = 1920;        // Background image width
var headerWidth = 960;        // How wide the header is.
var init;

function slide_in(){
    //Go to next pixel row.
    current += step;

    //Set the CSS of the header.
    $('#bgfade').css("background-position",current+"px 0");

    if(current==0) clearInterval(init);
}

//Calls the scrolling function repeatedly
$('#bgfade').click(function(){        
    init = setInterval(slide_in, 1);
});

这里的其他更改是范围，因此计时器 ID 可用于其他函数，并且不将字符串传递给 setInterval() 以避免任何其他潜在问题。