使用Tabkey的jquery Tab导航

时间:2018-03-30 19:12:42

标签: jquery webpage tabpanel

我正在使用JQuery UI标签。我需要能够使用Tab键从第1个选项卡导航到第2个选项卡,然后从第2个选项卡导航到第3个选项我在第一个标签上有几个链接。 目前,当我点击tab键时,它会将我从第一个标签转到第一个标签中的链接,而不是我希望它转到第二个标签

代码:

<script language="javascript" type="text/javascript">   
$(function () {
$("#tabs").tabs({
    activate: function() {
        var selectedTab = $('#tabs').tabs('option', 'active');
        $('#<%= hdnSelectedTab.ClientID %>').val(selectedTab);
    },
     active: document.getElementById('<%= hdnSelectedTab.ClientID %>').value
});


});
</script> 
<asp:HiddenField runat="server" ID="hdnSelectedTab" Value="0" />
<div id="tabs">
<ul>
    <li><a href="#tabs-1">All training</a></li>
    <li><a href="#tabs-2">By location</a></li>
    <li><a href="#tabs-3">Search</a></li>
</ul>
<div id="tabs-1">
     /* Control */
</div>
<div id="tabs-2">
    <asp:Panel runat="server" ID="LocationsPanel" />
</div>
<div id="tabs-3">
    <p>
        <asp:TextBox runat="server" ID="SearchTextBox" class="long" aria-label="Search Training Courses"></asp:TextBox>&nbsp;<asp:Button runat="server" ID="SearchButton" Text="Search" OnClick="SearchButton_Click" CssClass="lessfocus" />
    </p>  
</div>
</div>
</asp:Content>

我在这里缺少什么?请帮忙

0 个答案:

没有答案