Question

我有以下代码来显示标签。当我单击它们而不是页面加载时，选项卡会起作用（它显示所有选项卡的内容）。我还需要能够通过单击按钮打开页面上的所有第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

我也对其他标签解决方案持开放态度。

Answer 1

http://jsfiddle.net/agBgL/1/

您最初需要隐藏标签内容。

Answer 2

去除：

.ui-tabs .ui-tabs-panel { display: block; }

Reference

最初显示所有选项卡中的内容

2 个答案: