在加载新页面时保持标签持续活动[关闭]答案

【问题标题】：Keeping Tab persistently active on load of new page [closed]在加载新页面时保持标签持续活动[关闭]
【发布时间】：2016-03-22 23:26:25
【问题描述】：

现在我有一个基于选项卡的布局，当我单击一个选项卡并加载一个新页面时，单击它之前选项卡的悬停状态在加载新页面时不会持续存在，它默认为原始页面选项卡上设置。

购买时的模板完全符合我在此处所要传达的操作（请参阅链接）。我目前的工作（不是提供的链接）是我所说的关于不像最初购买的产品那样持久的工作。

【问题讨论】：

【解决方案1】：

我不确定这就是您所指的，但我的猜测是，例如，当您在“元素”选项卡上刷新页面时，您希望它重新加载“元素”选项卡被选中。

执行此操作的典型方法是使用哈希标签和一些 JavaScript 逻辑。具体来说：您的每个选项卡实际上是一个<a /> 标签，并且目前 - 它们每个都有一个 href='#' 的 url - 这意味着它们是哈希标签链接。但是 - 它们都链接到基本哈希。

通常，您会看到每个选项卡都有不同的哈希引用，它指的是页面应该处于的不同视图模式。所以 - 如果 URL 包含 #dashboard，则page 知道，一旦页面加载，它就应该显示仪表板。另一方面，如果 URL 包含 #elements，则应该显示“元素”选项卡。

有一些可靠的插件可以处理这类事情——但无需对你的 UI 进行重大重写（这已经很时髦了）——我建议只做一点 jQuery 来弄清楚是什么哈希是，并在加载时检查它。

查看 Stack Overflow 问题 Retrieve specific hash tag's value from url 作为使用主题标签的一些方法的示例。

【讨论】：

【解决方案2】：

如果您要解决的问题是如何设置选项卡以反映页面更改，则需要根据加载的 url 调整选项卡上的“当前”类。通过在 html 视图中检查 nav 元素，可以在浏览器控制台中轻松查看此类。

如果由您的服务器代码添加，类可能是最简单的。

导航选项卡的 javascript(jQUery) 代码从 scripts.js 的第 477 行开始

【讨论】：

【解决方案3】：

您的问题是，当新页面加载时，您没有将“当前”类传递给选项卡。因此，如果您单击第二个、第三个、第四个选项卡，并且页面重新加载或加载新的原始选项卡，“当前”类仍然是第一个选项卡。

您必须在每个页面的基础上手动将“当前”类应用于每个选项卡，或者构建一个逻辑来确定页面加载时您所在的页面，以使用“当前”类填充正确的选项卡，基本上这取决于您的实际模板的布局方式是静态的、动态的等等。

【讨论】：