Question

我希望获得有关如何不更改用于创建css选项卡的所有代码的想法（以便我可以将其放入包含文件中以避免在使用它的所有文件中复制代码），但是我的当前实现不允许这样做，因为我需要使用id =“selectedTab”选择活动选项卡。

到目前为止，我发现的唯一解决方案是以下方法： http://unraveled.com/publications/css_tabs/

它需要为每个选项卡指定一个类，并使用正文ID来确定活动选项卡。

这是唯一的方式还是有其他选择？

我当前的代码看起来像这样（id = noajax“用于避免使用ajax加载某些页面）：

<div class="productTabsBlock2">
  <a id="selectedTab" href="/link1" >OVERVIEW</a>
  <a href="/link2">SCREENSHOTS</a>
  <a id="noajax" href="/link3" >SPEED TESTS</a>
  <a href="/link4" >AWARDS</a>
</div>

编辑：asp可用作服务器端，已在这些页面上使用。

Answer 1

如果您正在寻找非JS解决方案，那么body class / id可以提供您想要的最简单方法。

如果您可以访问JS库，则可以轻松地将“selected”类添加到任何<a>元素并修改其外观。

如果您没有注意到，可以在元素中使用多个类定义。例如，<a class="noajax selected" />有效，CSS选择器.noajax和.selected都将应用于该元素。

Answer 2

包含文件是什么？如果它是像PHP这样的服务器端编程语言，则可以通过各种方法为所选选项卡传递参数。

Answer 3

你可以使用jQuery来添加`selectedTab'id（或类），如此

$('.productTabsBlock2 a').mouseover(function () {
  $(this).addClass('selectedTab');
});

css选项卡不需要为活动选项卡进行div更改

3 个答案: