Question

在jQuery mobile中，我有三个值的标签栏，当我在类别之间切换它只点亮一秒

我希望当我点击任何标签时，标签将设置为具有不同颜色的标签

我使用这个jQuery代码：

$(document).delegate('.ui-navbar ul li > a', 'click', function () {
    $(this).closest('.ui-navbar').find('a').removeClass('ui-navbar-btn-active');
    //$('.ui-navbar ul li > a').removeClass('ui-navbar-btn-active');
    $(this).addClass('ui-navbar-btn-active');
    //$('.content_div').hide();
    $('#' + $(this).attr('data-href')).show().siblings('.content_div').hide();
});

Html：

 <div class="boxshadow" >

        <div data-role="navbar">
            <ul>
                <li ><a href="javascript:;" data-href="a" data-theme="a"  class="ui-btn-active ui-state-persist" class="ui-navbar-btn-active">Shopping</a></li>
                <li><a href="javascript:;" data-href="b" data-theme="a">
                Entertainment</a></li>
                <li><a href="javascript:;" data-href="c" data-theme="a">Restaurants</a></li>
            </ul>
        </div><!-- /navbar -->

Answer 1

当你使用.ui-state-persist类时，无论你导航到什么页面，你都在告诉jQuery Mobile使li标签处于活动状态。所以你的jQuery脚本正在打败目的

Nix jquery脚本和.ui-state-persist类，并为.ui-btn-active类分配背景颜色，如此

[data-theme="b"].ui-btn-active { background: none 0 0 no-repet #whatever-color; }

如果您有多个页面结构（http://view.jquerymobile.com/1.3.1/dist/demos/widgets/pages/#Multi-pagetemplatestructure），导航栏应自动处理活动状态。

jquery mobile ui-btn-active不起作用

1 个答案: