Question

我是新来的。所以这可能是一个愚蠢的问题。我有一个CSS代码：

 <ul id="nav">
  <li><h1>Cover</h1><a class="cover" href="#cover"></a></li>
  <li><h1>About</h1><a class="about" href="#about"></a></li>
  <li><h1>CV</h1><a class="cv" href="#cv"></a></li>
  <li><h1>Contact</h1><a class="contact" href="#contact"></a></li>
 </ul>

所以现在当我点击“关于”时，“约”这个类将被改为“活跃”。与其他行类似。以及如何避免重复类“活动”？

我的jQuery代码如下，但没有任何反应：

$('#nav.about a').click(function() {
   $('#nav.about a').removeClass('about').addClass('active');
});

提前感谢任何帮助。

干杯。

Answer 1

您的选择器错误，选择器#nav.about a会查找a元素，该元素属于id nav 和 class的{{1}}。对于您的HTML，您正在寻找：about;给jQuery：

#nav a.about'

关于添加的问题，在评论（下文）中：

[如何避免多次选择的“活动”类？ ...当我点击“关于”时，此类设置为“活动”;当我点击“联系人”时，此类也设置为“活动”。所以我想同时限制一个“活跃”类。

要实现这一点，只需在$('#nav a.about').click(function() { $(this).removeClass('about').addClass('active'); });方法中选择具有该类名称的元素，如下所示：

click()

参考文献：

CSS Selectors。

Answer 2

将$('#nav.about a')更改为$('#nav a.about')

$('#nav.about a').click(function() {
   $('#nav a.about').removeClass('about').addClass('active');
});

Answer 3

您需要更改选择器。你所拥有的是说找到一个锚元素，它是ID为nav和类about“的元素的后代。你想要的是下面的内容，它说”找到一个带有类{{ {1}}这是ID为about的元素的后代：

nav

Jquery删除并在列表中添加新类

3 个答案: