Question

我有form个nav-tabs。当用户点击刷新或按F5时，我可以成功获取相同的标签。以下是我的代码：

// Store the currently selected tab in the hash value

$("ul.nav-tabs > li > a").on("shown.bs.tab", function(e) {
      var id = $(e.target).attr("href").substr(1);
      window.location.hash = id;
});

// on load of the page: switch to the currently selected tab

 var hash = window.location.hash;
 $('#nav-tabs-wrapper a[href="' + hash + '"]').tab('show');

现在问题是在submit上的任何其他event上获得相同的标签。

$("#New").on("click", function () {

    $.ajax({
        success: function (result) {
        location.reload();
        }
   });

});

现在，在成功的时候我正在尝试加载相同的位置，但它无法正常工作。它总是把我带到第一个标签。

Answer 1

您可以使用$ .cookie来保留选定的标签ID

showTab();

$("ul.nav-tabs > li > a").on("shown.bs.tab", function(e) {
      var id = $(e.target).attr("href").substr(1);
      window.location.hash = id;
      $.cookie("selectedTabId", hash);
      showTab();
});

function showTab()
{
    if($.cookie("selectedTabId") != null)
    {
       $('#nav-tabs-wrapper a[href="' + $.cookie("selectedTabId") + '"]').tab('show');
    }
    else
    {
       $('#nav-tabs-wrapper a[href="default"]').tab('show'); // show default
    }
}

Answer 2

您也可以使用locaStorage。当您在localStorage中提交表单存储当前选项卡ID时，如下所示：

$("ul.nav-tabs > li > a").on("shown.bs.tab", function(e) {
      var id = $(e.target).attr("href").substr(1);
      window.location.hash = id;
      localStorage.setItem('tab',id);
});

然后在提交表单后返回时读取localStorage键值。

$("#New").on("click", function () {

    $.ajax({
        success: function (result) {
        windlow.location = localStorage.getItem('tab');
        }
   });

});

执行活动后重新加载相同的标签？

2 个答案: