Question

我正在使用Atlassian Javascript框架在我的页面中创建标签。每次刷新页面时，它都会返回默认选项卡并离开选定的选项卡。我在堆栈溢出中搜索相同的问题之后添加了这段代码，但是它没有工作。

<script>
    $('#prod-discovery a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });

    // store the currently selected tab in the hash value
    $("ul.tabs-menu > li > a").on("shown.bs.tab", function (e) {
        var id = $(e.target).attr("href").substr(1);
        window.location.hash = id;
    });
    $('.active').removeClass('active');

    // on load of the page: switch to the currently selected tab
    var hash = window.location.hash;
    $('#prod-discovery a[href="' + hash + '"]').tab('show');

</script>

这是我创建标签的代码：

   <ul class="tabs-menu" role="tablist" id="prod-discovery">
        <li class="menu-item active-tab" role="presentation">
            <a href="#one" id="aui-uid-0-1430814803876" role="tab" aria-selected="true"><strong><h2>Tab One</h2></strong></a>
        </li>

        <li class="menu-item" role="presentation">
            <a href="#two" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab Two</h2></strong></a>
        </li>

        <li class="menu-item" role="presentation">
            <a href="#three" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab three</h2></strong></a>
        </li>

        <li class="menu-item" role="presentation">
            <a href="#four" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab Four</h2></strong></a>
        </li>

        <li class="menu-item" role="presentation">
            <a href="#five" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab5</h2></strong></a>
        </li>
    </ul>

供参考，您也可以查看 http://jsfiddle.net/alok15ee/5wpmsqe5/1/

Answer 1

在线：

$('#prod-discovery a[href="' + hash + '"]').tab('show');

没有＆＃39;＃＆＃39;失踪？使用href从当前标签中提取substring(1)值时，您需要删除哈希值。

尝试通过将上面的行替换为：

来使其工作

    $('#prod-discovery a[href="#' + hash + '"]').tab('show');

页面刷新更改“选定”选项卡并显示主选项卡。如何保持选定的选项卡完好无损？

1 个答案: