不连续循环当前图像

时间:2013-10-21 08:55:43

标签: javascript jquery

我尝试使用fadeIn和fadeOut选项添加不同的图像。现在脚本不断循环。但是我想在结束最后一个图像和警报时停止循环。而已。 我不知道我怎么能这样做以获得循环结束的警报。

$('document').ready(function() {
    var $imgs = $('#slideshow > img'), current = 0;

    var nextImage = function() {
        if (current >= $imgs.length) current = 0;
        $imgs.eq(current++).fadeIn(function() {
            $(this).delay(3000).fadeOut(nextImage);
        })
    };
nextImage();
});

Fiddle

1 个答案:

答案 0 :(得分:3)

你需要替换:

if (current >= $imgs.length) current = 0;

使用:

if (current >= $imgs.length) { 
    alert('end of images'); 
    return false; 
}

return false;将立即退出该方法。

最终代码应如下所示:

$('document').ready(function() {
    var $imgs = $('#slideshow > img'), current = 0;

    var nextImage = function() {
        if (current >= $imgs.length) {
            alert('End of images');
            return false;
        }
        $imgs.eq(current++).fadeIn(function() {
            $(this).delay(3000).fadeOut(nextImage);
        })
    };
    nextImage();
});
希望有所帮助。