jQuery切换多个按钮

问题描述

我有多个按钮，这些按钮通过jquery切换脚本获得其活动的CSS样式.但是我想一次只激活一个按钮.而且，当我重新单击活动按钮时，它必须变为非活动状态.

I have multiple buttons, that get their active css style with a jquery toggle script. But I want to have only one button at a time active. But also, when I re-click an active button, it has to become unactive.

$(document).ready(function(){
    $('.button').click(function() {
        $(this).toggleClass('buttonactive');
    });
});

基本上，我需要添加一行:

Basicly I need to add a line saying:

$(all .button except this).removeClass('buttonactive');

我不知道如何.有人能帮我吗?这是一个存在问题的JSFIDDLE: http://jsfiddle.net/nV5Tu/3/

I don't know how. Can someone help me?Here's a JSFIDDLE with the problem: http://jsfiddle.net/nV5Tu/3/

推荐答案

您可以使用 .toggleClass来做到这一点()切换当前元素.然后使用 .not()过滤掉当前元素删除类的元素

You can do it like this using .toggleClass() to toggle current element.. then using .not() to filter out current element from having class removed

$('.button').click(function() {
    $('.button').not(this).removeClass('buttonactive'); // remove buttonactive from the others
    $(this).toggleClass('buttonactive'); // toggle current clicked element
});

FIDDLE

这篇关于jQuery切换多个按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！