2012-08-01 53 views
2

現在我一直很開心地使用JQM。不過,我最近開始了一個新項目,該項目需要動態創建的頁面被推入歷史,其內容由url參數確定。我將向您展示我最初如何使用JQM接近控制器,以及我如何嘗試接近路由器插件。如何正確實現Jquery移動路由器插件

這是我以前寫我的JQM所有控制器:

myApp.foo.controller = (function($){ 

    "use strict"; 

    var $page; 

    var init = function() 
    { 
     $page = $("#foo-page"); 
     applyBindings(); 
    }; 

    var applyBindings = function() 
    {  
     // Page transition events 
     $page.bind("pagebeforeshow", onPageBeforeShow); 
    }; 

    var onPageBeforeShow = function() 
    { 

    }; 

    return { 
     init: init 
    } 

})(jQuery); 

$("#foo-page").live("pageinit", function(e) 
{ 
    myApp.foo.controller.init(); 
}); 

所以我現在用的JQM recommended routing plugin。我沒有使用脊柱或骨幹。我不想把這個錯誤當作它的基本應用。所以我加載我的所有控制器,然後加載我的router.js文件。

這給了我,我很期待的行爲:

var router = new $.mobile.Router([ 
     {"#foo-page": {events:"i", handler: myApp.foo.controller.init}}, 
     {"#foo-page": {events:"s", handler: myApp.foo.controller.onPageShow}},   

     {"#dynamic-foo(?:[?/](.*))?": {events:"i", handler: myApp.dynamicFoo.controller.init}}, 
     {"#dynamic-foo(?:[?/](.*))?": {events:"bs", handler: myApp.dynamicFoo.controller.onPageBeforeShow}}, 
    ]); 

但這是使用路由器插件的正確方法?因爲我閱讀了文檔,作者似乎將路由器對象用作實際控制器。

要清楚,這對我有用我只是不確定這是否真的是路由的想法或者這可能是錯誤的方法?

回答

3

別擔心,沒有「正確的方式」使用路由器,並且您的方法是正確的。

另一種方式做同樣的事情將是:

var router = new $.mobile.Router([ 
    {"#foo-page": {events:"i", handler: "init"}}, 
    etc 
],myApp.foo.controller); 

它只是一個品味的問題。