Question

我不能为我的生活弄清楚为什么这不会起作用

$("#color").click(function () {

        if ($("a").css("color", "#ffffff")) {
       $("a").css("color","#ff0000");
     } else  {
         $("a").css("color", "#ffffff");
     };

      });

第一次单击时，它会更改颜色。但如果再次点击，它就不会改回来。

我所看到的一切似乎都告诉我我的语法很好，但它只是不起作用。

Answer 1

代替if条件的语句将始终返回被视为true值的对象。因此控制将始终在if条件内，因此应用颜色#ff0000。第二次颜色再次变为#ffffff，但最后再次更改为#ff0000，因为如果条件返回true。过渡到这两种颜色变化并不明显（它太快了）。所以颜色似乎没有改变。

Answer 2

 if ($("a").css("color") == "#ffffff") {
       $("a").css("color","#ff0000");
 } else  {
       $("a").css("color", "#ffffff");
 };

可能会工作。我认为最好为此使用一个类，并使用hasClass和addClass以及removeClass。

Answer 3

尝试运行下面的代码链接

在jQuery中，您可以通过

设置css值

$('a').css('color', value).

你可以通过

获得css值

$('a').css('color');

注意：jQuery以RGB格式而不是十六进制返回颜色值。

在你的代码中，你正在做

if ($('a').css('color', '#ffffff')){

您正在设置颜色而不是比较颜色。

以下是：

＆＃13;

$('a').on('click', function(e){
  if ($('a').css('color') === 'rgb(255, 255, 255)')
    $('a').css('color', '#ff0000');
  else
    $('a').css('color', '#ffffff');
});

＆＃13;

body {
    background-color: black;
}
a {
    color: yellow;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a>Hello</a>

＆＃13;

Answer 4

这很接近......你需要比较颜色的值。

if语句中的行$("a").css("color", "#ffffff")是导致实际颜色变化的原因，而不是标记的值/颜色。

我会尝试这样的事情：

$("#color").click(function () {

    var color = $("a").css("color");

   if (color === "#ffffff" ) {
     $("a").css("color","#ff0000");
   } else  {
     $("a").css("color", "#ffffff");
   };

});

jquery如果声明只有一半工作

4 个答案: