jQuery Mobile + backbone.js:navbar问题

时间:2012-06-25 15:50:23

标签: jquery-mobile backbone.js

我使用路由器中的函数动态加载从模板创建的页面(如某些教程所示):

    changePage: function(page) { // page is a View object
        $(page.el).attr('data-role', 'page');
        page.render();
        $('body').append($(page.el));
        var transition = $.mobile.defaultPageTransition;
        if (this.firstPage) {
            transition = 'none';
            this.firstPage = false;
        }
        $.mobile.changePage($(page.el), {changeHash:false, transition: transition});
    }

当页面包含JQ Mobile导航栏时,活动项目不会突出显示。实际上它就像1毫秒一样,然后它不是,我觉得这是因为导航栏被“重新加载”。 当我在同一个项目上单击2次时,它会第二次运行。

有没有人能够使用jQuery Mobile和backbone.js工作导航栏?

1 个答案:

答案 0 :(得分:0)

我最终这样做了:

var activeTab = null;

$('[data-role=page]').live('pageshow', function (event, ui) { 
    $.each($('[data-role=navbar] ul li').children(), function (i, val) {
        if (typeof activeTab !== "undefined" && activeTab != null && $(val).attr('id') == 'navTab' + activeTab)
            $(val).addClass($.mobile.activeBtnClass);
        else
            $(val).removeClass($.mobile.activeBtnClass);
    });
    activeTab = null;
}); 

对于需要活动标签的每条路线,我只是这样做:

r_search: function() { // Search page (form)
    activeTab = "Search";
    this.changePage(new SearchView());
},