jQuery Cookie使用指南：如何用非remembered命名的cookie匹配编辑页标签

DevOps 小满

2026-10-2

解决方案

核心思路是提取Cookie中存储的tab序号，拼接当前页面的tab前缀匹配对应标签，修改后的完整代码如下：

$(document).ready(function() {
  // 先获取当前页面的tab前缀，自动适配信息页/编辑页
  const currentTabPrefix = $("a.tab").first().attr("tab-title").split("-")[0];
  const defaultTabId = `${currentTabPrefix}-tab1`;

  $("a.tab").click(function() {
    var activeTabId = $(this).attr("tab-title");
    $(".active").removeClass("active");
    $(this).addClass("active");

    $(".cont").slideUp();
    $("#" + activeTabId).slideDown();
    
    $.cookie('activeTab', activeTabId, {
      expires: 7
    });
  });
  
  var selectedID = $.cookie('activeTab');
  var targetTabId = defaultTabId;

  if (selectedID) {
    // 提取tab序号部分，比如nodeinfo-tab2提取出tab2
    const tabSuffix = selectedID.split("-")[1];
    targetTabId = `${currentTabPrefix}-${tabSuffix}`;
  }

  // 激活对应标签
  $(".active").removeClass("active");
  $(".cont").hide();
  $(`a.tab[tab-title="${targetTabId}"]`).addClass('active');
  $("#" + targetTabId).show();
});