JQueryクラスが異なる同じボタンをクリック

Question

クラス名がのテストボタンテストボタン -のボタンがあります。 テストボタンをクリックした後 -をチェックし、それが何かを行う必要がありますし、クラステストボタンに置​​き換えられる - テストボタンについて

をリセットする - 私は別の関数を書きたいが、それはdoesnのをリセット仕事はありません。以前の関数が再び実行されるためです。

$(".test-button--check").on("click", function() { 
    alert("Check is clicked"); 
    $(this).removeClass("test-button--check").addClass("test-button--reset"); 
}); 

$(".test-button--reset").on("click", function() { 
    alert("Reset is clicked"); 
    $(this).removeClass("test-button--reset").addClass("test-button--check"); 
}); 

どうすればよいですか？

おかげ

Answer 1

私はこれがうまくいくと思う：

var check = function checkFunc() { 
alert('Check is clicked!'); 
$(this).addClass('test-button--reset').removeClass('test-button--check'); 
$('.test-button--reset').unbind('click',check); 
$('.test-button--reset').bind('click',reset); 
} 
var reset = function resetFunc() { 
alert('Reset is clicked!'); 
$(this).addClass('test-button--check').removeClass('test-button--reset'); 
$('.test-button--check').unbind('click',reset); 
$('.test-button--check').bind('click',check); 
} 
$('.test-button--check').bind('click',check); 

バインドとアンバインドの使用

Answer 2

は、イベントハンドラを削除する）（.off使用してみてください、この場合には、それがクリックされます。

このようなものになるはずです。あなたはこのよう

$(".test-button--check .test-button--reset").on("click", function(e) { 
    e.preventDefault(); 
    var obj=$(this); 
    if($(obj).hasClass('test-button--check')){ 
     alert("Check is clicked"); 
     $(this).removeClass("test-button--check").addClass("test-button--reset"); 
    } 
    if($(obj).hasClass('test-button--reset')){ 
     alert("Reset is clicked"); 
     $(this).removeClass("test-button--reset").addClass("test-button--check"); 
    } 
}); 

Answer 3

にdocument.ready内にコードを書くことができます

$('.test-button.test-button--reset').off().click(function() {...});