0

ルーピーな方法でアイテムのクラスを数回切り替える方法は? 次のさまざまな組み合わせを試してみましたが、1/3 成功しました。最初のスイッチ クリックは機能します (ニュース -> 一部)、2 回目のクリックは機能しません (一部 -> 簡単)、3 回目は機能しません (簡単 -> ニュース)。事前に感謝します。

HTML

<td class="news">Click on me!<td>
<td class="news">Click on me too!<td>

CSS

.news { border: 3px solid red ; }
.part { border: 3px solid orange ; }
.easy { border: 3px solid green ; }

Jクエリ:

$("td").click(function () {
  if (        $("td").hasClass('news')) {
    $(this).removeClass("news").addClass('part');   /* click 1: works*/
  } else if ( $("td").hasClass('part')) {
    $(this).removeClass('part'  ).addClass('easy'); /* click 2: doesn't*/
  } else {
    $(this).removeClass('easy'  ).addClass('news'); /* click 2: doesn't*/
  }
});
4

3 に答える 3

2

Javascript

$("td").click(function () {
  if ($(this).hasClass('news')) {
    $(this).removeClass("news").addClass('part');   /* click 1: works*/
  } else if ( $(this).hasClass('part')) {
    $(this).removeClass('part'  ).addClass('easy'); /* click 2: doesn't*/
  } else {
    $(this).removeClass('easy'  ).addClass('news'); /* click 2: doesn't*/
  }
});

例: http://jsfiddle.net/sRvcK/

于 2013-01-13T23:44:31.223 に答える
0 
$("td").click(function () {

  var $this = $(this);

  if ($this.hasClass('news')) {

    $this.removeClass('news').addClass('part');

  } else if ($this.hasClass('part')) {

    $this.removeClass('part').addClass('easy');

  } else {

    $this.removeClass('easy').addClass('news');

  }
});
于 2013-01-13T23:46:26.637 に答える
0

if ブロックでは、以下のようthisに の代わりに使用する必要があります$("td").hasClass('news')

if ($(this).hasClass('news')) {
   //Do your thing...
}
于 2013-01-13T23:43:23.123 に答える