1

クリックと再クリック機能を呼び出したい画像があります。.toggle()関数の代わりに関数を使用しましたが、クリックせずに画像を非表示にしたため、以下のように.click()関数内でクリックと再クリックの機能を作成することにしました。.click()

$('.imgclass').click(function(){
   $(this).addClass('btn');
    if($(this).attr('class','btn')){

        $(this).css('background-color','blue');
        $(this).removeClass('btn');
    } else {
        alert('sorry');
    }
});

しかし、私のコードでelseステートメントが機能していません。最初のクリックで背景色を青に追加し、そのクラスを削除すると、クラス btn が見つからないため、「申し訳ありません」と警告する必要がありますが、警告はしません。関数内でクリックと再クリックを機能させるには、他に最善のアイデアがあると思います.click()。これを達成する方法は？

デモ

4

4 に答える 4

3 
$('.imgclass').click(function(){

   $(this).toggleClass('btn');

    if($(this).hasClass('btn')){
        $(this).css('background-color','blue');
    } else {
        alert('sorry');
    }
});

if ケースを機能させるには、次のゲッターを使用する必要がありますattr。

if($(this).attr('class') === 'btn'){

btnこれは、ボタンの唯一のクラスである場合にのみ、すぐに機能します。ただし、これよりも私のアプローチをお勧めします。

于 2013-09-13T08:40:08.450 に答える
2

これは、ボタンをクリックした後、

  1. クラス追加ボタン（常時）
  2. btnクラスがあるかどうか尋ねる
  3. btn クラスがあることを常に確認してください (手順 1 でクリックした直後に追加したため)。

編集: addClass を else ブロックに移動することをお勧めします。

于 2013-09-13T08:42:20.817 に答える
1

これを試して、

$('.imgclass').click(function(){
    if($(this).hasClass('btn')){
        $(this).removeClass('btn');
    } else {
        $(this).addClass('btn');
    }
});

フィドル http://jsfiddle.net/xQNK6/3/

または単に

$('.imgclass').click(function(){
    $(this).toggleClass('btn');       
});

フィドル http://jsfiddle.net/xQNK6/6/

于 2013-09-13T08:38:53.857 に答える
0

あなたのif状態は間違っています。

要素にクラスがあるかどうかを確認するには、hasClass関数を使用する必要があります。

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

それ以外の場合は、class属性を設定し、正しく設定されているかどうかを確認しています。

完全なコードは次のようになります。

$('.imgclass').click(function(){
   $(this).addClass('btn');
    if($(this).hasClass('btn')){

        $(this).css('background-color','blue');
        $(this).removeClass('btn');
    } else {
        alert('sorry');
    }
});

toggleClass他の仲間が指摘しているように、利用することをお勧めしますが.

于 2013-09-13T08:40:34.723 に答える