Question

我有一组3个按钮，我希望以一种方式对它们进行编码，当单击按钮时，按下它，而其他2个按钮进入默认状态。我在jQuery中尝试了以下代码行，但是unpress部分似乎不起作用。很高兴得到一些帮助/指出正确的方向。已经在CSS文件中定义了类“active”和“default”。

$(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

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

1 个答案: