Javascript jQuery每个函数parseInt循环

我的代码应该用以status-fade-out开头的类创建一组div，然后通过添加10将类从ie status-1更改为status-11。除了parseint循环和类变为status-179831、status-179832之外，一切都在运行

$(function disappear(){
    $('[class^="status-"]').delay(5000).fadeOut(400)
    $('[class^="status-"]').each(function(){
        num = $(this).attr('class').split('status-')[1];
        num = parseInt(num, 10) + 10;
        $(this).attr("class", "status-"+num+"");
    })
    $('[class^="status-"]').delay(1000).fadeIn(400)
    disappear();
})

---

要使操作按顺序进行，需要使用动画的完成功能，如下所示：

$(function (){

    function runOne(item) {
        item.delay(5000).fadeOut(400, function() {
            var num = item.attr('class').split('status-')[1];
            num = parseInt(num, 10) + 10;
            item.attr("class", "status-"+num+"")
                .delay(1000).fadeIn(400, function() {runOne(item)});
        });
    }

    // start all the animations    
    $('[class^="status-"]').each(function() {
        runOne($(this));
    });
})

工作演示：

在编写代码时，这两个动画是异步的，您的

。每个（）循环或下一次调用
消失（）
不要等待动画完成。当动画完成时，使用像这样的完成函数会触发序列的下一部分。您还希望始终确保在局部变量前面使用
var
，以避免意外地使它们成为全局变量


您还可以同步promise对象，该对象将确保所有动画始终在每次迭代中同时启动：

$(function disappear() {
    var all = $('[class^="status-"]');
    all.delay(5000).fadeOut(400, function() {
        var item = $(this);
        var num = item.attr('class').split('status-')[1];
        num = parseInt(num, 10) + 10;
        item.attr("class", "status-"+num+"")
        item.delay(1000).fadeIn(400);
    })
    // when all animations are done, start the whole process over again
    all.promise().done(disappear);
})

此选项的工作演示：


要在每次迭代后将类名恢复为原始类名，可以执行以下操作：

$(function () {
    // save original class names
    var all = $('[class^="status-"]').each(function() {
        $(this).data("origClassName", this.className);
    });

    function disappear() {
        all.delay(5000).fadeOut(400, function() {
            var item = $(this);
            var num = item.attr('class').split('status-')[1];
            num = parseInt(num, 10) + 10;
            item.attr("class", "status-"+num+"")
            item.delay(1000).fadeIn(400);
        })
        // when all animations are done, start the whole process over again
        all.promise().done(function() {
            // restore class names
            all.each(function() {
                this.className = $(this).data("origClassName");
            })
            // run it all again
            disappear();
        });
    }
    // start it
    disappear();
})

工作演示：
您可以添加一点DOM来更好地了解正在发生的事情吗？感谢它工作得很好，但是我该如何将其更改回状态1、状态2。。。每次淡入淡出后？@user2974729-我不明白你想做什么。每次迭代后，您是否试图还原原始的
状态xxx
类？@user2974729-我在回答中添加了一个选项，用于保存/还原原始类名。