如何在jQuery Mobile中以编程方式切换导航栏选项卡？

Question

如何在jQuery Mobile中切换导航栏的界面，以便我可以按div中的按钮并显示不同的导航栏？

Answer 1

jsFiddle Demo jQuery Mobile NAV Toggle

我已经通过上面的链接创建了一个 jsFiddle演示，可以解决您的问题。

特别是，您可以轻松地设置资产净值栏以及将其与不同的栏进行切换。

我说不同的小节，因为小提琴允许你需要的更多NAV条，并且非常容易来适应。可以肯定的是， 5个按钮的任何NAV栏 maxs-out 。

编辑：根据您的留言评论，一旦创建超过1页，就可以轻松在页面之间导航。这个不同的 jsFiddle 显示如何标记锚标记以即时切换页面。 可以与原始的jsFiddle Answer一起使用，以提供完整解决方案。

重新编辑：根据您最近的评论，此新 jsFiddle允许在同一页面上切换按钮内容。

提供简单的小提琴评论以了解正在发生的事情，但询问任何不清楚的事情。

Answer 2

签出updatelayout事件。此事件由框架内的动态显示/隐藏内容的组件触发，并且作为通知其他组件可能需要更新其大小或位置的通用机制。 来自jQuery站点的例子：

$( '#foo' ).hide().trigger( 'updatelayout' );

Answer 3

这是你想要达到的目标吗？ http://jsfiddle.net/cHrSN/18/

Answer 4

您的标签是否必须在JQM urlHistory或浏览器历史记录中进行整合？

如果没有，我将collapsible-set更改为tabviewer，因此我更改了小部件以支持数据类型=＆＃34;水平＆＃ 34;然后显示可折叠的从左到右，内容部分显示为选项卡。我还添加了下一个按钮，因此您可以通过单击选项卡按钮或上一个按钮来回来回。

但是，这一切都发生在页面内部，因此没有浏览器后退按钮支持。

如果这是正确的方向，我可以提供一个样本页面和说明。