タブを表示する以下のコードがあります。タブをクリックすると機能しますが、ページの読み込みでは機能しません(すべてのタブのコンテンツが表示されます)。また、ボタンをクリックするだけで、ページ上のすべての 1 番目、2 番目、または 3 番目のタブを開くことができる必要があります (ページ上の複数のタブ グループ)。
$("ul.tabs").each(function() {
$(this).find('li:first').addClass("active");
$(this).next('.tab_container').find('.tab_content:first').show();
});
$("ul.tabs li a").click(function() {
$(".tab_content").hide();
var cTab = $(this).closest('li');
cTab.siblings('li').removeClass("active");
cTab.addClass("active");
cTab.closest('ul.tabs').nextAll('.tab_container:first').find('.tab_content').hide();
var activeTab = $(this).attr("href"); //Find the href attribute value to identify the active tab + content
$(activeTab).fadeIn(); //Fade in the active ID content
return false;
});
jsfiddle .
また、他のタブ ソリューションも受け入れています。