Question

我有一个导航动画，通过css背景应用于具有“js”类的元素。我不希望这个动画出现在当前页面的链接上（一个类“当前”由PHP回显到当前页面）。

所以基本上你在主导航中你的（当前页面）链接的页面将有一个当前类，其他的是一类js - 并获得动画。如何在功能中应用该逻辑？我可以通过CSS背景来做，但想在js中做到这一点。这里使用的是与css结合使用的js，用于所需的外观：

 $(function() {
    $("ul#mainNav li a").addClass("js");
        $("ul#mainNav li a").hover(
          function () {
            $(this).stop(true,true).animate({backgroundPosition:"(0 0)"}, 200);
            $(this).animate({backgroundPosition:"(0 -5px)"}, 150);
          },
          function () {
            $(this).animate({backgroundPosition:"(0 -130px)"}, 200);

          }
        );
    });

我试图无济于事：

$(function() {
    if($("ul#mainNav li a").hasClass("current")) {
    //do nothing
    } else {
    $(this).addClass("js")
    }

//rest of animation function

}）;

});

Answer 1

$("ul#mainNav li a").not(".current").addClass("js");

您的if也应该有效，但是您混淆了this和$("ul#mainNav li a")。

Answer 2

有几种方法可以解决这个问题。如果您需要其他东西的选择器，您可以这样做：

$(function() {
    $("#mainNav li a").each(function() {
        if (!$(this).hasClass("current")) {
            $(this).addClass("js")
        }
    });

//rest of animation function
});

如果您不需要整个选择器用于其他事情，那么您可以更简单地执行此操作：

$("#mainNav li a").not(".current").addClass("js");

注意，我已经从主选择器的开头删除了ul，因为它不是必需的，因为ids是唯一的。

Answer 3

if(! $("ul#mainNav li a").hasClass("current")) {
    $("ul#mainNav li a").addClass("js")
}

另一个答案更好，但如果你坚持这样做，这就是你的if语句的工作方式。 $（this）仅适用于正确的范围。当你使用像：

这样的闭包时，你会混淆它的用法

$（ 'A'）。每个（函数（）{ $（本）.stuff（）; }）;

Answer 4

你可以使用jQuery提供的:not选择器来更简洁地完成它：

$("ul#mainNav li a:not(.current)").addClass("js")

Answer 5

对于在现场活动中向我们看这个的人（例如.live（'click'，）

 $("ul#mainNav li a").not(".current").addClass("js");

GolezTrol的'.not'答案（上图）虽然有效但通常可以落在现场活动上。

所以我建议使用Chris G.（下文）提供的答案

 if(! $("ul#mainNav li a").hasClass("current")) {
  $("ul#mainNav li a").addClass("js")
 }

我希望这对某人有用，因为它可以节省一些时间来弄清楚他们做错了什么（就像我的情况一样）

jQuery只有在没有其他类的情况下才添加一个类

5 个答案: