Question

想要尝试通过三个独立链接上的切换来控制此精灵的状态。我有三个单独的链接，我想我可以点击任何链接来切换一个或一个。目标是改变#case图像的状态。

我以为我可以使用addClass，但我不知道如何删除之前放在那里的任何类。假设它是一些变量吗？

  $("li.ti-color a").click(function(){
      $("#logo-link").toggleClass('red');

      });

  $("li.black-pvd a").click(function(){
      $("#logo-link").toggleClass('blue');


  });

  $("li.white-color a").click(function(){
      $("#logo-link").toggleClass('white');


  });

<div id="case">

    <a href="#" id="logo-link"></a>

</div>


<ul id="links"></li>
    <li class="black-pvd"><a href="#">Black PVD</a></li>
    <li class="ti-color"><a href="#">Titanium</a></li>
    <li class="white-color"><a href="#">White</a></li>

</ul>

提前谢谢。

Answer 1

RemoveClass（）有效：http://api.jquery.com/removeClass/

$("li.ti-color a").click(function(){
  $('#logo-link').removeClass('blue white').addClass('red');
});

$("li.black-pvd a").click(function(){
  $('#logo-link').removeClass('red white').addClass('blue');
});

$("li.white-color a").click(function(){
  $('#logo-link').removeClass('red blue').addClass('white');
});

或者如果你想用另一个类替换所有现有的类，我们可以使用.attr（'class'，'white'）。像：

$("li.ti-color a").click(function(){
  $('#logo-link').attr('class', 'red');
});

$("li.black-pvd a").click(function(){
  $('#logo-link').attr('class', 'blue');
});

$("li.white-color a").click(function(){
  $('#logo-link').attr('class', 'white');
});

通过切换更改单个Div中的图像？

1 个答案: