jQuery 显示和隐藏计时器

Question

所以，我有这 3 个选项卡式部分，可以显示和隐藏 onClick，但现在我希望它们在用户不点击任何地方时也能像幻灯片一样播放。

这是我所拥有的:

$(文档).ready(function() {
    函数 rClass() {
        $('.slide_1_link').removeClass('on');
        $('.slide_2_link').removeClass('on');
        $('.slide_3_link').removeClass('on');
    }
    函数 rFadeOut() {
        $('.slide_1').fadeOut();
        $('.slide_2').fadeOut();
        $('.slide_3').fadeOut();

        $('.slide_content_1').fadeOut();
        $('.slide_content_2').fadeOut();
        $('.slide_content_3').fadeOut();
    }
    $('.slide_1_link').click(function(){
        rClass();
        rFadeOut();
        $('.slide_1_link').addClass('on');
        $('.slide_1').fadeIn();
        $('.slide_content_1').fadeIn();
    });
    $('.slide_2_link').click(function(){
        rClass();
        rFadeOut();
        $('.slide_2_link').addClass('on');
        $('.slide_2').fadeIn();
        $('.slide_content_2').fadeIn();
    });
    $('.slide_3_link').click(function(){
        rClass();
        rFadeOut();
        $('.slide_3_link').addClass('on');
        $('.slide_3').fadeIn();
        $('.slide_content_3').fadeIn();
    });

});

有人知道一个好的计时器插件或实现该功能的简单方法吗？

感谢您的宝贵时间!

Answer 1

您可以编写一个函数来依次触发三个链接上的点击事件，然后使用 setInterval 将其设置为每 5 秒运行一次，如下所示:

var cycleIndex = 0;

function cycle() {
    var index = cycleIndex % 3;
    $('.slide_' + (index + 1) + '_link').click();
    cycleIndex += 1;
}

setInterval(cycle, 5000);