今天突然用到须要动态改变tab页,
布局代码例如以下:
动态创建js代码例如以下:function createTabs(tabs){ var html = ''; for(var i=0;i<tabs.length;i++){ html = html + createTab(tabs[i].tabname,tabs[i].tabid,tabs[i].ispage); } $('#divtabul').empty(); $('#divtabul').html(html); $('#divtab').navbar('refresh');//注意这一行,danielinbiti } function createTab(tabname,tabid,isPage){ var lihtml = '<li><a onclick="clickTab(this,true)" data-ajax="false" txt="'+tabname + '" >'+ tabname + '</a></li>'; return lihtml; }
開始以为navbar刷新和listview基本类似。结果发现navbar没有refresh。仅仅有_create,而create又是不能外部使用的。
网上找了一圈,似乎也没有找到实用的。直接navbar()的方式,布局都有问题。
于是自己补充navbar。以下代码存为jquery-mobile-navbar.js
在页面中引入js例如以下
经过上面处理后,就能够用$('#divtab').navbar('refresh');进行刷新了动态结果例如以下。測试tab页刷新
function testTabs(){ var list = new Array; for(var i=0;i<3;i++){ var obj = new Object; obj.tabname='tab'+i; obj.tabid='tab'+i; obj.ispage=i; list[list.length] = obj; } createTabs(list); }