时间戳

首页 > 解决方案 > 如何在特定选项卡处于活动状态时打开链接

javascript - 如何在特定选项卡处于活动状态时打开链接

问题描述

我有 3 个 php 文件 content.php、functions.php 和 topic.php 我希望当用户单击 topic.php 中的链接时，他们会被重定向到 tab1 打开的页面，并且在同一链接上但在不同的按钮上当他们点击链接时，tab2 是打开的。

我已经尝试过使用 onClick="" 和 jquery 的代码，但这些都没有奏效。

活动选项卡必须反映用户在站点上单击的位置（即用户是单击第一个“代数”链接还是第二个链接）。

链接在topics.php中定义和创建

标签： javascripthtmljquery

解决方案

有一种更简单的方法可以做到这一点，并且不需要 JavaScript。使用:targetCSS 选择器。

<div class="tab" id="tab1">
  <h1>This is Tab #1</h1>
</div>

<div class="tab" id="tab2">
  <h1>This is Tab #2</h1>
</div>

在您的 CSS 中，从以下内容开始：

.tab {
  display: none;
}
.tab:target {
  display: block;
}

然后，当您转到 时page.html#tab1，您将看到第一个选项卡。或者，page.html#tab2你会看到第二个。

这应该让你开始。您显然希望设置您的 CSS 规则，以便在默认情况下显示其中一个选项卡，因为当页面显示时没有锚片段。而且，您需要从某个地方链接到这些锚片段。

推荐阅读