Javascript 带计时器的jQuery addClass removeClass

我对“最新消息”模块有问题。请看一看模块的示例（靠近页面顶部的div中有一个大图像）

现在我已经设置好了，当用户点击一个标签时，主文章就会显示出来。这方面的jQuery是：

    jQuery(document).ready(function() {

    $(".moduletable.latestnews article:first-child").addClass("atfront")

    $(".moduletable.latestnews article").click(function(){
        $(".moduletable.latestnews article").css("zIndex",1).addClass("atback").removeClass("atfront");
        $(this).css("zIndex",100).addClass("atfront").removeClass("atback");
    });
});

这一切都非常简单和直接。我遇到的问题是，我希望文章在几秒钟后自动更改。这将进入一个无限循环，从第1条开始，然后在几秒钟后显示第2条等等

我确信这相当简单，但我已经用尽了JavaScript的知识。感谢您提供的任何帮助：）

---

我已经创建了一个JSFIDLE，您可以使用setTimeout来更改前面的文章。如果您选择类为“.atfront”的文章，然后使用

.next（）

选择器，您应该可以获得所需的功能

$(function(){
    var articleToggler = function articleToggler(){
    var front = "atfront",
        back = "atback";
    return function(){
       var selection = $(".moduletable.latestnews")
                          .find("article.atfront")
                          .addClass(back)
                          .removeClass(front);
           next = selection.next("article"); 
           next = next.length ? next : $(".moduletable.latestnews")
                                   .find("article").first();
           next.addClass(front)
               .removeClass(back);
           console.log(selection.length,next[0])  


       setTimeout(articleToggler(),1000); //changes every second
    };
};

//start the rotation
(articleToggler())();
});

---

超时过期后，setTimeout将调用作为第一个参数传递的函数。超时参数以毫秒为单位，因此上面的代码在调用函数之前等待1秒。由于上面的函数将其自身添加为回调，这将不确定地重复

您可以根据您希望显示/隐藏元素的方式使用setInterval和/或setTimeout。find（“：n子项（“+i+””）在DreamWeaver中创建语法错误，结果是它不工作，不确定原因；前面的行太多了谢谢你在这方面的帮助，我正在使用你更新的代码，但我在第行遇到了一个错误。removeClass（返回）@user1817708我正在更新代码，因此没有看到您的评论。您对当前代码有相同的问题吗？非常感谢！！！用你的精彩代码让它工作。再次感谢你。