jQuery Deferred 与 jQuery Mobile "pageshow" 事件相结合答案

【问题标题】：jQuery Deferred in combination with jQuery Mobile "pageshow" eventjQuery Deferred 与 jQuery Mobile "pageshow" 事件相结合
【发布时间】：2014-08-08 19:06:39
【问题描述】：

我尝试实现类似于jQuery API page 上的示例。

简而言之：

数据已加载（用于日历和其他一些事情）
当用户第一次访问 jQuery Mobile 页面时，日历会被初始化
当两个数据都被加载并初始化日历时，会发生其他事情

问题：当我在“#overview”以外的另一个页面上打开该页面时，它仍然会触发 $.when，即使尚未触发日历事件。当我切换到“#overview”页面时，.one 事件会正确触发。

在控制台中：

-------------------------------------------------------------
page: "#initial"
*** data received *and* calendar initialized
[Object, "success", Object] undefined
-------------------------------------------------------------
page: "#overview"
going to initialize calendar

我拥有的代码：

    var getData = $.getJSON("./testDeferredData.php");

    function initializeCalendar() {
        var deferred = $.Deferred();
        $(document).one("pageshow", "#overview", function(event,ui) {
            console.log("going to initialize calendar");
            deferred.resolve("calendar initialized");
            return deferred.promise();
        });
    }

    $.when(getData, initializeCalendar() ).then(function(data,calendar) {
        console.log("*** data received *and* calendar initialized");
        console.log(data,calendar);
    });

我是 Deferred 和 Promise 的新手，所以我很可能犯了一个愚蠢的错误。有什么建议吗？

【问题讨论】：

您的 return deferred.promise() 错误地位于事件处理程序中，而不是在 initializeCalandar 函数中。该函数返回 undefined ，它被强制转换为已解决的承诺。

标签： javascript jquery jquery-mobile promise deferred

【解决方案1】：

如果您传递的参数不是延迟/承诺对象，它将被视为已解决。所以你必须正确返回promise对象。

function initializeCalendar() {
    var deferred = $.Deferred();
    $(document).one("pageshow", "#overview", function(event,ui) {
        console.log("going to initialize calendar");
        deferred.resolve("calendar initialized");    
    });
    //return promise object immediately
    return deferred.promise();
}

【讨论】：