JQuery单击具有不同类的相同按钮答案

【问题标题】：JQuery click same button with different classJQuery单击具有不同类的相同按钮
【发布时间】：2016-11-06 17:13:05
【问题描述】：

我有一个类名为 test-button test-button--check 的按钮。单击 test-button--check 后，它应该做一些事情并被替换为类 test-button--reset

对于 test-button--reset 我想写另一个函数，但是它不起作用。因为，之前的函数又执行了。

$(".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");
});

我能做什么？

谢谢

【问题讨论】：

请在您的问题中添加一些代码 - 然后我们也许可以告诉您为什么它不起作用！

标签： javascript jquery button click

【解决方案1】：

您可以通过这种方式在 document.ready 中编写代码

$(".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");
   }
});

【讨论】：

【解决方案2】：

尝试使用 .off() 删除事件处理程序，在本例中为单击。

应该是这样的：

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

【讨论】：

【解决方案3】：

我认为这会奏效：

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);

使用绑定和解除绑定

【讨论】：