各個父選項卡下的子選項卡未顯示

Question

單擊Tab2時，它顯示<div id="custom-sub-tab0" ，單擊Tab3時，它不顯示任何內容。 單擊Tab3時，它應顯示<div id="custom-sub-tab0"

HTML：

<nav class="ti_tabs u-clear">
            <ul>
                    <li><a href="#std-sub-tab0"> <span> Tab1 </span></a></li>
                    <li><a href="#"> <span> Tab2 </span></a></li>
                    <li> <a href="#custom-sub-tab0"> <span> Tab3 </span></a></li>
            </ul>
    </nav>
        <div id="std-sub-tab0" class="ti_subTabNav" data-nav="sub-tab">
            <ul>
                    <li><a href="/subtab0.html"><span> Featured applications </span></a>
                    </li>
                    <li><a href="/content/ti/en_US/amplifiers/overview/reference-designs.html"><span> Reference designs </span></a>
                    </li>
            </ul>
        </div>  
        <div id="custom-sub-tab0" class="ti_subTabNav" data-nav="sub-tab">
            <ul>
                    <li class="is-active"><a href="custtab0.html"><span> customsubtab1 </span></a>
                    </li>
            </ul>
        </div>

我的陪審員：

$(document).ready(function(){
        $("div[id*=sub-tab]").hide();
        $("div[id*=sub-tab]").find("ul > li.is-active").parent().parent('div').show();
        $('.ti_tabs ul li').click(function(){
                $('.ti_tabs ul li').removeClass('is-active');
                $(this).addClass('is-active');
                $('div[id*=sub-tab]').hide().eq($(this).index()).show();
            });
    });

我嘗試了很多事情，但仍然無法正常工作。 我是jquery新手。 請指導。

Answer 1

您只有兩個具有id * = sub-tab的元素，因此index == 2將不會顯示任何內容。

這是您可能想要編輯JS以使其可能（以可能的方式）工作的方式：

$(document).ready(function(){
    $("div[id*=sub-tab] li").hide();
    $("div[id*=sub-tab] li").first().show();
    $("div[id*=sub-tab]").find("ul > li.is-active").parent().parent('div').show();
    $('.ti_tabs ul li').click(function(){
        $('.ti_tabs ul li').removeClass('is-active');
        $(this).addClass('is-active');
        var items = $('div[id*=sub-tab] ul li');
        items.hide();
        $(items[$(this).index()]).show();
    });
});

Answer 2

我認為您只有2個子標簽和3個LI，因此會有索引不匹配的情況。