Question

我的网站有问题。它有一个带有两个选项卡的页面。在第二个选项卡中，有一个分页，我正在使用引导程序。我遇到的问题是，当我单击分页上的另一个页面时，它又回到了第一个选项卡。

我尝试使用哈希链接修复它。当我这样做时，它会闪烁第一个选项卡毫秒，然后显示不是我想要的第二个选项卡。我希望它即使单击分页后也显示相同的选项卡。另外，请注意，我正在使用Ajax。

<ul class="nav nav-tabs" id="resumes-tab">
    <li class="active"><a data-toggle="tab" href="#shortlisted-resumes-list" aria-expanded="true">Shortlisted</a></li>
    <li class=""><a data-toggle="tab" href="#download-resumes-list" aria-expanded="false">Downloads</a></li>
</ul>
<div class="tab-content">

    <div id="shortlisted-resumes-list" class="tab-pane fade active in">
        <div class="cs-resumes" data-adminurl="https://example.com/wp-admin/admin-ajax.php"></div>
    </div>

    <div id="download-resumes-list" class="tab-pane fade">
        <div class="cs-resumes" data-adminurl="https://example.com/wp-admin/admin-ajax.php">
            <nav>
                <ul class="pagination">
                    <li><a aria-label="Previous"><span aria-hidden="true"><i class="icon-angle-left"></i>Previous</span></a></li>
                    <li><a class="active">1</a></li>
                    <li><a href="javascript:void(0);" aria-label="Next" onclick="cs_dashboard_tab_load('resumes', 'employer', 'https:\/\/example.com/wp-admin/admin-ajax.php', '83', '','2')"><span aria-hidden="true">Next <i class="icon-angle-right"></i></span></a></li>
                </ul>
            </nav>
        </div>
    </div>

</div>

这是我的jQuery代码段

<script>
    // Javascript to enable link to tab
    var hash = document.location.hash;
    var prefix = "";

    if (hash) {
        jQuery('.nav-tabs a[href="' + hash.replace(prefix, "") + '"]').tab('show');
    }

    // Change hash for page-reload
    jQuery('.nav-tabs a').on('shown.bs.tab', function (e) {
        var hash = document.location.hash;
        window.location.hash = e.target.hash.replace("#", "#" + prefix);
        jQuery("html, body").animate({ scrollTop: $(".cs-dash-resumes-tabs").offset().top }, "slow");
    });
</script>

为什么会这样？因为我在使用Ajax？

重新加载时打开上一个标签

0 个答案: