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



我尝试在jQuery API页面上实现类似的示例。

总之:

  • 数据被加载(用于日历和其他一些东西)
  • 当用户第一次访问jQuery移动页面时,日历被初始化
  • 当两个数据都被加载并且日历被初始化时,会发生其他事情

问题:当我在"#overview"以外的另一个页面上打开页面时,它仍然会触发$。时,即使日历事件尚未触发。当我切换到"#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的新手,所以很可能我犯了一个愚蠢的错误。建议吗?

如果你传递的参数不是一个deferred/promise对象,它将被视为已解析。所以你必须正确地返回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();
}

最新更新