jQuery Mobile的Backbone.js的+：导航栏问题 [英] jQuery Mobile + backbone.js: navbar issue

问题描述

我从加载模板创建的页面动态与路由器的一种功能（如看到一些教程）：

I load pages created from templates dynamically with a function from the Router (as seen on some tutorials):

    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导航栏，活动项目不突出。实际上，它是像1毫秒，那就不是，我觉得这是因为导航栏的重载。
当我点击同一项目的2倍，它的工作原理是第二次。

The thing is when pages contain a JQ Mobile navbar, the active item is not highlighted. Actually it is, like 1 ms, then it's not, I feel like it's because the navbar is "reloaded". When I click 2 times on the same item, it works the second time.

有没有人谁能够有工作navbars使用jQuery Mobile和Backbone.js的？

Is there anybody who is able to have working navbars with jQuery Mobile and backbone.js?

推荐答案

我落得这样做是：

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;
}); 

而对于一个需要激活的标签我只是比如做每条路线：

And for each route that requires an active tab I just do for instance:

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

这篇关于jQuery Mobile的Backbone.js的+：导航栏问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！