jQuery mobile - 本地存储准备好后显示页面答案

【问题标题】：jQuery mobile - show page after local storage is readyjQuery mobile - 本地存储准备好后显示页面
【发布时间】：2012-11-19 14:25:14
【问题描述】：

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

你可以在这里查看：

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

等'

本地存储包含每个页面的数据（例如：“app2u_app6_home”）和通用标签数据（“app2u_app6_Tabs”）

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

如何强制页面仅在本地存储准备好后显示？

【问题讨论】：

你应该在这里发布你的 HTML/JavaScript 而不是链接

标签： jquery-mobile local-storage

【解决方案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'
        );
    }
}

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

【讨论】：