0

3 つの別々のリンクのトグルを介して、このスプライトの状態を制御しようとしました。私は 3 つのリンクを持っており、どのリンクをクリックしても 1 つまたはオフに切り替えることができると考えました。目標は #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>

ありがとうございます。

4

1 に答える 1

3

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');
});
于 2010-12-22T22:57:06.457 に答える