Question

我的应用程序中有5个选项卡。我使用Jquery完成了它。目前，当页面加载时，它将转到第一个选项卡并查看其内容。在这里，我想加载页面加载时的最后一个选项卡及其内容。我不想更改标签顺序。当页面加载时，它应该加载最后一个选项卡及其内容。我尝试了一些代码，但它加载了第一个选项卡及其内容。我在下面的

中包含了html和Jquery代码

<div class="track-content track-content1" id="tab-container">
                <ul class="track-nav track-nav1" id="ultabs">
                    <li id="liHome"><a href="home.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="active tabbify" data-id="Home">home</a></li>
                    <li id="linkdailyReport"><a href="Report/DailyReport.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="tabbify" data-id="dailyReport">Daily Report</a></li>
                    <li id="liTeamReport"><a href="Report/TeamReport.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="tabbify" data-id="teamReport">Team Report</a></li>
                    <li id="liPulledReport"><a href="Report/PulledReport.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="tabbify" data-id="PulledReport">Pulled Report</a></li>
                    <li id="liMarkReport"><a href="Report/MarkReport.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="tabbify" data-id="MarkReport">Marked Report</a></li>

                    <li id="liManagePulled"><a href="Report/ManagePulled.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" data-id="ImageUpload" class="tabbify">Image Upload</a></li>
                    <li id="liMetrics"><a href="Metrics/Metric.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" data-id="Metric" class="tabbify">Metric</a></li>
                    <li id="liAdmin"><a href="Admin/MaintenanceScreens.html?oJjeW0EE268roaAJQapM65hyD134lhhhN3F5j7KVQKs=" class="tabbify">Admin</a></li>

                    <li id="liLogout" style="float: right; cursor: pointer; padding: 3px 10px;">
                        <img class='homeicon' src="images/Logout.png" alt="Logout" id="Img2" style="width: 24px; height: 24px;" /></li>
                    <li id="lisitedetails" style="float: right; cursor: pointer; padding-top: 3px;">
                        <img class='homeicon' src="images/Facility.png" alt="Facility" id="Img1" style="width: 24px; height: 24px;" /></li>

                    <li style="float: left; cursor: pointer; padding-top: 3px;">
                        <img src="images/Expand.png" id="btnHead" alt="Show/Hide" style="width: 24px; height: 24px;" class='homeicon' />
                    </li>
                </ul>
                <!-- <div style="float: right; position: fixed; display: inline-block; color: white; z-index: 9999999; padding-top: 5px; padding-right: 15px;">
                    <img src="images/Expand.png" id="btnHead" style="width:24px;height:24px;" />
                </div>-->              

                <div id="tabContent" class="tab-content">
                    <!-- Tab Contents Loaded From Ajax -->
                </div>
                <!--#tab-content-->
            </div>

$（＆＃34; ul.track-nav＆＃34;）。标签（

    "#tabContent",
    {   
        effect: 'ajax', history: true, tabs: 'a.tabbify' ,
    }

  );

Answer 1

您必须使用active关键字指定要默认打开的选项卡。

例如

如果要加载的目标选项卡是第五个，您可以按如下方式指定

$(function() 
{
      $("#tabs" ).tabs( { active: window.location.hash - 1 } );      
      //subtract one as the tabs are identified based on zero
});

只要您的页面加载

，就可以调用此函数

如何在不更改Tab键顺序的情况下以编程方式更改Jquery中的选项卡及其内容？

1 个答案: