jquery-mobile - JQuery 移动持久导航栏（外部页面 div）

Question

我在页脚中的页面 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 只是由于某种原因没有被添加......

Answer 1

好的，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);
    });
});