JQuery移动持久导航栏(外页div)

时间:2014-07-17 20:28:41

标签: jquery-mobile jquery-mobile-button jquery-mobile-navbar

我在页脚div外面有一个导航栏(它在每个页面上)我试图对导航栏的持久活动状态进行简单修复它适用于其中一个页面上的选项卡但似乎不适用于此。

实际上,一切都有效,除了某些原因ui-btn-active没有添加

这是代码

$(document).one( "pageinit", function() {
  $('div[data-role="footer"] [data-role="navbar"] a').click(function(e) {
    $(this).html("abc");
    $('div[data-role="footer"] [data-role="navbar"] .ui-btn-active').removeClass('ui-btn-active ui-state-persist');
    $(this).addClass('ui-btn-active ui-state-persist');
});

});

主播的html发生变化,ui-state-persist会在最后一行添加,但ui-btn-active因某种原因不会被添加...

1 个答案:

答案 0 :(得分:0)

好吧似乎jquery mobile会自动删除页面转换时的ui-btn-active,即使你的导航栏不在页面div(我觉得有点蹩脚......)它似乎是在pagebeforeshow之后或之后执行此操作,因为这不适用于那个事件......所以我只是使用了pageshow。

以下是工作代码:

var navbar;
$(document).on("pageshow", function() {
    if(navbar) {
        $(navbar).addClass('ui-btn-active')
    }
});
$(document).one( "pageinit", function() {
    $('div[data-role="footer"] [data-role="navbar"] a').click(function() {
        navbar = $(this);
    });
});