刷新后Jquery Tab应保持不变

Question

我是Jquery的新手。我正面临选项卡实现的问题。当我刷新页面时，我被重定向到初始设置选项卡。

$(function() {
            var indicator = $('#indicator'),
            indicatorHalfWidth = indicator.width()/2,
            lis = $('#tabs').children('li');

            $("#tabs").tabs("#content section", {
                effect: 'fade',
                fadeOutSpeed: 0,
                fadeInSpeed: 400,
                onBeforeClick: function(event, index) {
                    var li = lis.eq(index),
                    newPos = li.position().left + (li.width()/2) - indicatorHalfWidth;
                    indicator.stop(true).animate({ left: newPos }, 600, 'easeInOutExpo');
                }
            }); 

            });

这是HTML视图：

<nav>
<ul id="tabs">
    <li><a class "current" t" href="#">Change Password</a></li>
    <li><a href="#">Update Your Profile</a></li>
</ul>
<span id="indicator"></span>
</nav>
<div id="content">
    <section>
    <!--content1 -->
    </section>
    <section>
    <!--content2-->
    </section>
</div>

Answer 1

您可以通过多种方式完成此操作。这有两种方法：

1. 您可以使用以下帖子
中详细说明的哈希标记

Can I keep on same jQuery tab on page refresh or when I have navigated away from the page?

1. 使用指定的Cookie选项初始化选项卡。

$( "#tabs" ).tabs({ cookie: { expires: 30 } });