JQuery 延迟不起作用

Question

我有以下 AJAX/JQuery 脚本:

    function changeModalBodyContent(content,time) {
        $(".modal-body").empty();
        $(".modal-body").delay(time).html(content);
    }
    //twitter bootstrap script

    $("button#delete").click(function () {
        var modalText = $(".modal-body").html();

        changeModalBodyContent("<div class='progress progress-striped active'><div class='progress-bar' style='width:100%;'></div></div>",0);

        $.ajax({
            type: "GET",
            url: "deleteArticleType.php",
            data: { 'typeID': lastClickId },
            success: function (msg) {
                $("#myModal").modal('hide');
                $("tr[data-id='" + lastClickId + "']").remove();
                $("#message-placeholder")
                .html("<div class='alert alert-dismissable alert-success'><button type='button' class='close' data-dismiss='alert'>×</button><strong>sucess!!!</strong></div>");
                changeModalBodyContent(modalText,2000); 
            },
            error: function () {
                alert("Error!");
            }
        });

    });
}); 

我希望函数 changeModalBodyContent 的第二次调用中的文本在一段时间后显示，而不是立即显示，我尝试了上面的代码，但它不起作用。

为什么以及如何解决它？

Answer 1

延迟是为动画队列构建的，但您可以使用队列:

http://api.jquery.com/queue/#queue-queueName-callback-next-

.queue( [queueName ], callback( next ) )

    $(".modal-body").delay(time).queue(function(next){
      $(this).html(content);
      next()
    });

请注意，Zepto.js 既不支持延迟，也不支持队列。