javascript - 我如何声明以便在 jquery 移动 UI 中突出显示默认选项卡

Question

我是 jquery 的新手。我正在使用 jquery mobile 创建一个应用程序 UI。

我从他们的移动标签页网站上获得了这个样本。我如何声明，以便默认选项卡位于“到期贷款”下，并且其选项卡将突出显示。

<div data-role="tabs" id="tabs">
        <div data-role="navbar">
            <ul>
                <li id="loansDue"><a href="#one" data-ajax="false">Loans Due</a></li>
                <li id="overDue"><a href="#two" data-ajax="false">Overdue</a></li>
            </ul>
        </div>
        <div id="one" class="ui-body-d ui-content">
            <ul data-role="listview" data-inset="true">
                <li><a href="loanInfo.html">AY1415S2/109</a></li>
                <li><a href="loanInfo.html">AY1415S2/110</a></li>
            </ul>
        </div>
        <div id="two" class="ui-body-d ui-content">
            <ul data-role="listview" data-inset="true">
                <li><a href="loanInfo.html">AY1415S2/106</a></li>
                <li><a href="loanInfo.html">AY1415S2/107</a></li>
                <li><a href="loanInfo.html">AY1415S2/108</a></li>
                <li><a href="loanInfo.html">AY1415S2/109</a></li>
                <li><a href="loanInfo.html">AY1415S2/110</a></li>
            </ul>
        </div>
    </div>

我试过了

$('#tabs').tabs({ selected: 1 }); 

和

var SelectedTab = $('ul li#loansDue').index();

$( ".selector" ).tabs({ selected: SelectedTab  })

但它们都不起作用。请指教。

Answer 1

使用 active 属性 - 其中“1”表示选项卡的索引

JSFiddle

$( "#tabs" ).tabs({
  active: 1
});