只需要将data-role="navbar"赋给div即可：
class="ui-btn-active"用于表示该nav呈选中状态，还可以使用ui-state-persist保持这种选中状态，以免每次进入该page选中状态复位的问题。
navbar一行上最多显示5个，多余5个的话会换行显示。
navbar可以放在header，footer，content中。
你可以让每个nav都有一个icon，并且可以指定icon的位置
还可以自定义icon,设置data-icon="custom"，然后为每个a设置background即可：
.nav-glyphish-example .ui-btn { padding-top: 40px !important; }
.nav-glyphish-example .ui-btn:after { width: 30px!important; height: 30px!important; margin-left: -15px !important; box-shadow: none!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; -webkit-border-radius: 0 !important; border-radius: 0 !important; }
#chat:after { background: url("../_assets/img/glyphish-icons/09-chat2.png") 50% 50% no-repeat; background-size: 24px 22px; }
#email:after { background: url("../_assets/img/glyphish-icons/18-envelope.png") 50% 50% no-repeat; background-size: 24px 16px; }
#login:after { background: url("../_assets/img/glyphish-icons/30-key.png") 50% 50% no-repeat; background-size: 12px 26px; }
#beer:after { background: url("../_assets/img/glyphish-icons/88-beermug.png") 50% 50% no-repeat; background-size: 22px 27px; }
#coffee:after { background: url("../_assets/img/glyphish-icons/100-coffee.png") 50% 50% no-repeat; background-size: 20px 24px; }
#skull:after { background: url("../_assets/img/glyphish-icons/21-skull.png") 50% 50% no-repeat; background-size: 22px 24px; }
当然如果想换皮肤的话也很简单，需要设置class="ui-body-a ui-body"，把其中的a改成b,c,c,e....：
如果想设置单个navbar的话，需要使用data-theme属性：
==============================================================================
后面更精彩
==============================================================================
上面谈到的Navbar无非就是换不同的内容的，注意：不是换page！！！如果换page的话只需要用button就可以了。Navbar一般用于在同一界面显示不同的内容的！
既然是同一界面显示不同的内容，那么像下面的代码如何实现呢？
上面的代码的问题：将连接指向了新的page，既然是新的page，就不会有navbar，难道再新page中重复写一个一模一样的？Bad idea!
为了解决这个问题，需要引入Tabs
在tabs中使用navbar：
上面这种是最普通的写法。呈现的是上下结构的Tabs。
如果是左右结构需要在listview中添加data-inset="true"和class="tablist-left"
完整的代码如下：
Use inset listview for tabs
用到的CSS：
.tablist-left {
width: 25%;
display: inline-block;
}
.tablist-content {
width: 60%;
display: inline-block;
vertical-align: top;
margin-left: 5%;
}
over！
navbar动态生成不刷新？
http://blog.csdn.net/danielinbiti/article/details/27333311