Question

我的页面上有一个JQuery选项卡，目前当我重新加载或运行一些服务器端代码时，该选项卡将返回到第一个，是否有办法使标签保持不变？我希望我的标签保留在当前选定的标签上，而不是在页面重新加载时返回第一个标签

我的JQuery：

 $(function () {
           var tabContainers = $('div.tabs > div');
           $('div.tabs ul.tabNavigation a').click(function () {
               tabContainers.hide();
               tabContainers.filter(this.hash).show();
               $('div.tabs ul.tabNavigation a').removeClass('selected');
               $(this).addClass('selected');
               return false;
           }).filter(':first').click();

       });

我的标签：

<div class="tabs">
        <ul class="tabNavigation">
            <li><a href="#Annoucments">Annoucments</a></li>
            <li><a href="#Events">Events</a></li>
            <li><a href="#Photos">Photos</a></li>
            <li><a href="#JobOpportunities">Job Opportunities</a></li>
            <li><a href="#Contacts">Contacts</a></li>
            <li><a href="#Videos">Videos</a></li>
        </ul>
        <div id="Annoucments" class="ContentDIV">
      ..

        </div>
        <div id="Events" class="ContentDIV">

            ..
        </div>

        <div id="Photos" class="ContentDIV">
           ..

        </div>

        <div id="JobOpportunities" class="ContentDIV">
           ..
        </div>

        <div id="Contacts" class="ContentDIV">
           ...

        </div>

        <div id="Videos" class="ContentDIV">
           ..

        </div>

    </div>

Answer 1

在您的网页网址中添加一个get参数。所以你可以将yourpage.aspx？page = 1作为例子。然后只需从查询字符串中取出该参数，然后在服务器端代码中应用“selected”类（这将是最好的）或在页面上的jQuery中直接应用（不是一个好的解决方案，但它也可以工作）到适当的标签。

编辑（代码示例）

$('#[formID]').onSubmit(function () {
    var tab = $('.selected').prop('href');
    // Append a hidden field to the form containing tab. Example below
    return true;
}

...然后当您从服务器加载页面时，只需查看传递的值并将“selected”类应用于元素。

实施例： jQuery - add additional parameters on submit (NOT ajax)

Answer 2

您需要在某处保存用户状态：

Url - 解析网址并确定它是否属于您的标签。
Cookie - 写入Cookie用户信息（例如选定的标签）。
会话 - 与cookie相同。
自定义隐藏字段或asp.net ViewState。

Answer 3

您可以尝试的一件事是保留一个隐藏字段，以保持当前所选选项卡的href值。这样，当有回发时，您可以从该隐藏字段中读取值并选择正确的选项卡。

asp.net中的JQuery Tabs继续重载

3 个答案: