jQuery Mobile - 操作DOM - 刷新页面

Question

这整个jQuery移动动态数据（从服务器提取数据）让我疯狂。为什么操作DOM和刷新页面会很困难？

我有我的页面：

<div data-role="page" id="intranet-holidays" data-title="HOLIDAYS" data-add-back-btn="true"></div>

在document.ready中我有以下内容：

$( document ).delegate( "#intranet-holidays", "pagebeforecreate", function() {
   $('body').addClass('ui-loading');
   $.mobile.loadingMessage = "Loading Holidays...";
   $.mobile.showPageLoadingMsg();
   // calls getJSON to retrieve data from the web server
   loadHolidays();
});

当我的数据从服务器返回时，我将可折叠的DIV添加到我的页面（intranet-holidays）。

在可折叠DIV内部，我有一些UL。

我知道我的语法是正确的，因为我可以获取生成的HTML，将其保存到文件中，然后显示该文件，并且所有文件都正确显示。这是一个屏幕截图：

这是我的动态加载页面的样子（不是我想要的）：

我知道我可以使用以下内容刷新列表视图：

$('#list').listview('refresh');

这对列表很有用。

如何刷新页面（包含可折叠DIV和可折叠DIV包含UL）？

是的，我希望页面中的所有数据都是动态的。

Answer 1

在获取JSON数据的AJAX调用的success处理程序方法中，在创建列表后添加$('#intranet-holidays').trigger('create');。

Answer 2

尝试：

$('#page').trigger('create');

或阅读：

http://www.elijahmanor.com/2011/02/dynamically-appending-elements-to.html