2015-03-31 22:02 2011人閱讀 評論(0) 收藏 舉報

版權聲明：本文為博主原創文章，未經博主允許不得轉載。

appframework3.0好像是3月24日發布的，今天31號，發現和之前的appframework2.1 || 2.2并不同。

jqmobi3.0中不在支持 data-load/data-unload 屬性。

如果想繼續用 以前的 data-load/data-unload??可以復制一下代碼放到您的程序中

They are renamed, and there is now "before" events too.??If you liked the old way, you could always write a plugin to enable it.

?

[plain] view plaincopy

//psuedo?code??

var?dispatchPanelEvent:function(fnc,myPanel){??

????if?(typeof?fnc?===?"string"?&&?window[fnc])?{??

????????return?window[fnc](myPanel);??

????}??

????else?if(fnc.indexOf(".")!==-1){??

????????var?scope=window,items=fnc.split("."),len=items.length,i=0;??

????????for(i;i<len-1;i++){??

????????????scope=scope[items[i]];??

????????????if(scope===undefined)?return;??

????????}??

????????return?scope[items[i]](myPanel);??

????}??

};??

$(document).on("panelload",function(e){??

???var?hasLoad=$(e.target).attr("data-load");??

??

???return?dispatchPanelEvent(hasLoad,e.target);??

})??

??

$(document).on("panelunload",function(e){??

???var?hasLoad=$(e.target).attr("data-unload");??

??

???return?dispatchPanelEvent(hasLoad,e.target);??

})??

結構：

id="mainview" 肯定是 app頁面的主視圖。

id="splashscreen" 是加載頁面過渡的代碼塊。

在id="mainview" 中，直接header 和 footer 應該是默認的公共頂部和底部。nav是左右導航，id=left做導航，id=right是右導航。

左右導航中還包含header和footer，可以以class=pages再分多個頁面。

data-include="“包含一個子頁面。

data-left-drawer="left" 聲明左導航。

class="panel"聲明一個畫面。

data-title="Main"是當前畫面頂部標題。如果沒有可能會繼承上一級的header。

data-selected="true" 默認選中這個畫面。

?data-tab="navbar_ui" 選中的id=navbar_ui的ID。

?data-footer="footerui"自定義底部導航。

title=""也是標題，出現在頂部，不知道和data-title="Main"區別。

data-menu-close 關閉左右導航。

data-menu-close data-right-menu="right" 關閉又側導航。

οnclick="$.afui.drawer.hide('#left')" 關閉id=left的導航。

$.afui.drawer.show('#right','right','push')打開右導航像推動效果。

data-transition="slide" 轉場效果為slide

轉載于:https://www.cnblogs.com/aishangliming/p/6206829.html

總結

以上是生活随笔為你收集整理的appframework3.0（JQmobi）入门教程的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。