jQuery在选择后禁用按钮行为

我有两个按钮并排打开下面单独的内容位，但是我希望与可见内容位关联的按钮在您再次选择它时不做任何操作

再次单击按钮时，内容将关闭。（基本上，始终需要显示内容。）

另外，是否可以将第一个按钮内容作为默认打开

代码如下：

任何建议，谢谢

$(document).ready(function(){
$('.firstbutton').click(function(){
    if($('#first').is(':visible')) {
        $('#first').hide();
    }
    else {
    $('#second').hide();
    $('#first').fadeIn();
    }
});
});
$(document).ready(function(){
$('.secondbutton').click(function() {
    if ($('#second').is(':visible')) {
          $('#second').fadeOut();
        if ($("#second").data('lastClicked') !== this) {
           $('#second').fadeIn();
        }
    } 
    else {
        $('#first').hide();
        $('#second').fadeIn();
    }
    $("#second").data('lastClicked', this);
});
});

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

---

您可以删除所有切换代码，将.ButtonActivity类添加到.firstbutton并设置display:block；首先

$（文档）.ready（函数（）{
$（'.firstbutton'）。单击（函数（）{
$（“#秒”）.hide（）；
$（'#first'）.fadeIn（）；
});
});
$（文档）.ready（函数（）{
$（'.secondbutton'）。单击（函数（）{
$（'#first'）.hide（）；
$（'#second'）.fadeIn（）；
$（“#秒”）.data（'lastClicked'，this）；
});
});
$（文档）.ready（函数（）{
$（'.button'）。单击（函数（）{
$（this.addClass（'buttonactive'）；
$（'.button'）.not（this.removeClass（'buttonActivity'）；
});
});
#容器{
浮动：左；
显示：内联；
背景：#fff；
高度：自动；
}
#首先{
显示：块；
宽度：500px；
高度：300px；
背景色：#EC644B；
颜色：#fff；
字体系列：Arial；
字体大小：30px；
文本对齐：居中；
}
#第二{
显示：无；
宽度：500px；
高度：300px；
背景色：#446CB3；
颜色：#fff；
字体系列：Arial；
字体大小：30px；
文本对齐：居中；
}
.按钮{
宽度：250px；
显示：内联块；
明确：两者皆有；
利润率：10px0；
字体大小：24px；
字体系列：Arial；
字体大小：300；
线高：49px；
文本对齐：居中；
颜色：#fff；
光标：指针；
}
.第一个按钮{
背景色：#EC644B；
}
.第二个按钮{
背景色：#446CB3；
}
.按钮式{
颜色：#000；
背景色：#fff；
边框底部：5px实心#000；
}

第一个按钮
第二个按钮
一个
两个
完美-正是我想要的！谢谢！