0

我是新来的。所以也许这是一个愚蠢的问题。我在下面有一个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');
});

提前感谢您的帮助。

干杯。

4

3 回答 3

3

您的选择器错误,选择器#nav.about a查找的元素是具有ofof的a元素的子元素。对于您的 HTML,您正在寻找:给jQuery:idnav classabout#nav a.about'

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

关于添加的问题,在评论中(如下):

【如何避免被多次选中的类“活跃”?...当我单击“关于”时,此类设置为“活动”;同样,当我单击“联系”时,此类也设置为“活动”。所以我想同时限制一个“活动”课程。

为此,只需在方法中选择具有该类名的元素click(),如下所示:

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

参考:

于 2013-06-06T18:54:48.073 回答
0

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

$('#nav.about a').click(function() {
   $('#nav a.about').removeClass('about').addClass('active');
});
于 2013-06-06T18:54:30.267 回答
0

您需要更改选择器。你所说的是找到一个锚元素,它是具有 ID navAND 类的元素的后代about“。你想要的是下面,它说“找到一个锚标签,其类about是具有 ID 的元素的后代nav

$('#nav a.about').click(function() {
   $(this).removeClass('about').addClass('active');
});
于 2013-06-06T18:54:42.283 回答