jQuery移动端-本地存储就绪后显示页面

Question

我正在开发一个基于jqm和本地存储的移动应用程序

您可以在此处查看：

clients/app2u/Apps/6/home.html
clients/app2u/Apps/6/gallery.html
clients/app2u/Apps/6/categories.html

etc‘

本地存储包含每个页面的数据(例如："app2u_app6_home")和常规选项卡数据("app2u_app6_Tabs")

问题是，在第一次访问页面时，页面在数据完全加载之前加载，并且只有当您刷新页面时，页面才会包含数据。

如何强制页面仅在本地存储就绪后显示？

Answer 1

注意:我假设您在您的站点上引用的是functions.js中的getPageData函数。

您的问题是$.post调用是异步的(与对localStorage.getItem的调用不同)，因此您的getPageData函数不能立即返回。

相反，您应该重构它以接受回调函数：

function getPageData(page,wait,extra_data,callback) {
    if (localStorage.getItem(unique_param+page)) {
        callback(localStorage.getItem(unique_param+page, extra_data));
    } else {
        if (typeof(extra_data) == 'undefined') {extra_data = '';}
        $.post(server_path + 'index.php?module=API&pname=' + page + '&pmode=empg&application_id=' + application_id + extra_data,
                function(response) {
                    localStorage.setItem(unique_param+page,JSON.stringify(response));
                    callback(response);
                }
        ,'json'
        );
    }
}

使用此方法，代码将始终等待对本地存储的调用或对服务器的调用完成