动态更改导航栏

Question

当用户更改设置时，我想更改主页面上的导航栏。我有：

<section id="main" data-role="page">
<nav data-role="navbar">
   <ul></ul>
</nav>
</section>

我使用JavaScript填充无序列表，但它失去了它的CSS样式。

问：当用户从“设置”页面返回并再次看到主页时，我用什么事件来确保导航栏的样式正确？

问：在用户按下“返回主页”按钮后，我应该触发什么事件来刷新主页？

编辑：

实际上，该列表也在pageinit上填充。

Answer 1

Q1。

如果您在pagebeforecreate，pagecreate或pageinit期间填充导航栏，则无需为其设置样式。如果您在以后的活动中这样做，那么就这样做：

$('#pageID').trigger('pagecreate');

这将触发整页重新打印，包括页脚和标题。如果您只需要重新设置页面内容，请使用：

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

在我的另一篇文章中详细了解它： https://stackoverflow.com/a/14550417/1848600

Q2。

在这种情况下，您可以阻止主页兑现，那就是那样。

官方文档： http://jquerymobile.com/demos/1.2.0/docs/pages/page-cache.html

要防止网页兑现使用属性 data-dom-cache =“false”：

<div data-role="page" id="dontCacheMe" data-dom-cache="false">

但遗憾的是，如果主页面是要显示的第一页，或者至少是第一页HTML的一部分，则无法阻止兑现。

在这种情况下，清除每个具有生成内容的元素并再次触发页面创建。

编辑：

我忘了提。动态添加导航栏元素是错误的，并且无法按预期工作。前段时间我创建了一个如何动态添加导航栏元素的示例， 你可以在这里找到它： http://jsfiddle.net/Gajotres/V6nHp/

可以在我的其他 ARTICLE 中找到此更多内容，或者可以找到 HERE 。