在jquery mobile中刷新动态创建的页面

Posted

技术标签:

【中文标题】在jquery mobile中刷新动态创建的页面【英文标题】:Refresh dynamicaly created page in jquery mobile 【发布时间】:2011-11-18 19:02:25 【问题描述】:

我有以下问题:

我使用的是 Jquery mobile ,用户可以搜索产品并动态创建这些页面的详细信息:

类似:

 $("body").append('<div class="products" data-role="page" id="'+pageId+'"><div data-role="header"><p class="backSearch"><a href="#base" data-rel="back" data-role="button" data-inline="true" data-icon="back">back</a></p><h1>' +data.title+ '</h1></div></div>');

 // create the content DIV
 $('#'+pageId).append('<div data-role="content" id="content_'+pageId+'">...</div>');

它工作正常,但问题是当您转到产品详细信息并单击刷新时,表单再次出现,并且由于 Dom 已刷新,我无法再访问产品详细信息(需要这样做另一个搜索等..)

有什么办法可以解决这个问题吗?

【问题讨论】:

我一直使用占位符页面,动态添加数据并刷新页面 【参考方案1】:

要在本地保存这些详细信息并在浏览器刷新后保持可用,请尝试使用store.js。这是一个用于存储局部变量的跨浏览器 javascript 库:

https://github.com/marcuswestin/store.js

【讨论】:

感谢您的回答,但我更喜欢只使用 jquery 解决方案 您将无法单独使用 jQuery 来存储这些变量。您需要使用本地存储。因此,您最好的选择是通过 store.js 之类的本地存储,或者对您的 URL 进行一些巧妙的处理。【参考方案2】:

我正在使用浏览器的本地存储来存储数据。当页面刷新时,我会检查变量中的数据,如果需要,可以从本地存储中加载。

【讨论】:

【参考方案3】:

使用empty()清除目标的内容

$('#'+pageId).empty().append('<div data-role="content" id="content_'+pageId+'">...</div>');

【讨论】:

以上是关于在jquery mobile中刷新动态创建的页面的主要内容,如果未能解决你的问题,请参考以下文章

changePage 后 jQuery Mobile 刷新页面

JQuery Mobile 1.3 选择菜单动态刷新

预取和缓存动态创建的 jquery Mobile+PhoneGap 页面

点击后通过 JavaScript 动态创建 jQuery Mobile 页面

jQuery Mobile 页面刷新机制

如何在 Jquery Mobile 中测试页面是不是已“创建页面”?