Question

我希望我的javascript / jquery应用程序停止执行所有动画，并且仅在显示加载.gif时继续执行。

我确实设法显示加载.gif而其他动画正在进行中，但我真的需要它在其他任何动画之前已经显示。

所以我编造了一个等待回调执行的方法，但它并没有像预期的那样工作。

var Shown = false;
function ShowLoadingGif() {
    $("#loading").show("fast", function() {
        Shown = true;   
    });
    while(!Shown) {
        //wait for callback to be executed
    }
    Shown = false;
}

见this JFiddle example。我不仅想知道如何正确地解决这个问题;我也很感激为什么它没有像我期望的那样工作。

提前致谢！

Answer 1

你可以使用jQuery Deferred Object（参见Docs）

来使用这样的东西

var Shown = false;
function ShowLoadingGif() {
    var $promise = $.Deferred();
    $("#loading").show("fast", function() {
        $promise.resolve("Im done");
    });
    $promise.done(function(data) {
         // data === "Im done"
    });
}

我已经更新了您的小提琴，现在可以按照您的预期完成提醒

Fiddle（http://jsfiddle.net/k5Wan/3/）

此外，我已更新代码质量

var $promise = $.Deferred();

$promise.done(function() {
    alert("Done...");
});

$(function() {
    $("button").on("click", function() {
        $("#loading").show("slow", function() {
            $promise.resolve();
        });
    });
});

Answer 2

你可以缩短所有这些：

$('#loading').show('fast', function(){
  console.log('Im loaded');
}).promise().done(function(){
  console.log('great loading with you!');
});

DEMO

JQuery show（） - 暂停函数，直到执行回调

2 个答案: