我该如何在jQuery Mobile中切换导航栏的界面,以便我可以按下div中的按钮并显示不同的导航栏?
我已经通过上面的链接创建了一个jsFiddle演示,可以解决您的问题。
特别是,您可以轻松地设置NAV栏,并在不同的栏之间进行切换。
我说不同的栏,因为这个小工具允许添加更多的NAV栏,并且非常容易适应。确保任何NAV栏最大化在5个按钮处。
编辑: 根据您的留言评论,一旦创建了超过1个页面,就可以轻松地在页面之间导航。这个不同的jsFiddle演示了如何在需要时切换页面标签。这可以与原始的jsFiddle答案一起使用,提供一个完整的解决方案。
重新编辑: 根据您最近的评论,这个新的jsFiddle允许在同一页上切换按钮内容。
提供简单的fiddle注释以理解正在发生的事情,但如果有任何不清楚的地方,请随时问。
您是想要实现这个效果吗? http://jsfiddle.net/cHrSN/18/
你的选项卡是否需要集成在JQM urlHistory或浏览器历史记录中?
如果不需要,我将可折叠集更改为选项卡查看器,因此不再是从上到下的可折叠部件,而是支持data-type="horizontal"的小部件,然后将可折叠部分从左到右显示为选项卡。我还添加了下一个/上一个按钮,因此您可以通过单击选项卡按钮或上一个/下一个按钮来前进和后退。
但是,所有这些都发生在页面内部,因此没有浏览器后退按钮支持。
如果这个方向正确,我可以提供一个示例页面和说明。
查看updatelayout事件。此事件由框架内的组件触发,用于动态显示/隐藏内容,并作为通知其他组件可能需要更新其大小或位置的通用机制。 来自jQuery网站的示例:
$( '#foo' ).hide().trigger( 'updatelayout' );
data-theme
属性,该属性指定了单个锚链接的按钮颜色。a=黑色,b=蓝色,e=黄色,等等。锚链接本身已经准备就绪,每个链接都可以设置为调用所需的NAV状态。这有帮助吗? - arttronics