在jQuery Mobile中刷新动态创建的页面

Question

我有以下问题：

我正在使用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已刷新，所以我无法再访问产品详细信息（需要进行其他搜索等） ..）

有解决此问题的解决方案吗？

Answer 1

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

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

Answer 2

我正在使用浏览器的本地存储来存储数据。 刷新页面后，我检查变量中的数据，并在需要时从localstorage加载。

Answer 3

使用empty（）清除目标内容

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