如何在点击时选择并按下按钮，并取消按下所有其他按钮？

Question

我有一组3个按钮，我想以某种方式对它们进行编码，当单击一个按钮时，它将被按下，而另外两个按钮则会进入其默认状态。我在jQuery中尝试了以下几行代码，但undepress部分似乎不起作用。能够得到一些帮助/指出正确的方向会很好。在CSS文件中定义了“活动”和“默认”类。

$(function() { 
    $('#easybtn').click(function() { 
     $(this).toggleClass('active'); 
      $('#mediumbtn').toggleClass('default'); 
      $('#hardbtn').toggleClass('default'); 
    }); 
}); 

$(function() { 
    $('#mediumbtn').click(function() { 
     $(this).toggleClass('active'); 
      $('#easybtn').toggleClass('default'); 
      $('#hardbtn').toggleClass('default'); 
    }); 
}); 

$(function() { 
    $('#hardbtn').click(function() { 
     $(this).toggleClass('active'); 
      $('#easybtn').toggleClass('default'); 
      $('#mediumbtn').toggleClass('default'); 
    }); 
}); 

Answer 1

首先分配一个公用类所有的人都...生病叫它difficulty-button则：

$('.difficulty-button').click(function() { 
    var $this = $(this), 
     $all = $('.difficulty-button'); 

     $all.not($this).toggleClass('active', false).toggleClass('default', true); 
     $this.toggleClass('active', true).toggleClass('default', false); 
}); 

Fiddle in action