2

今のところタブ付きのインデックス ページがあります。まだどこにもリンクしていませんが、タブをクリックしたときにアクティブなクラスを設定しようとしています。

タブは次のとおりです。

<ul class="nav nav-tabs">
            @foreach(var division in Model)
            {
                <li class="span2""><a href="#">@division.Description</a></li>
            }
            <li class="active span2"><a href="#">All</a></li>
            <li class="span2"><a href="#">Summary</a></li>
        </ul>

そしてjquery：

<script type="text/javascript">

$(document).ready(function() {
     $("#tabs li").click(function() {
        $("#tabs li").removeClass('active'); 
        $(this).addClass("active");
        $(".tab_content").hide();
        $(selected_tab).fadeIn();
        var selected_tab = $(this).find("a").attr("href");
    });
});

また、関数 SetActiveTab() を指すタブで onclick イベントを設定して、その中のアクティブなクラスを削除しようとしましたが、それも機能しません。

function SetActiveTab() {
    $("#tabs li").removeClass("active");
}

ここで何が欠けていますか？

4

2 に答える 2

1

liidで の親要素を参照しようとしています#tabs。コード スニペットが不完全で、の親#tabs要素liがある可能性がありますが、そうでない場合はliclass .nav、.nav-tabsまたはその両方でアクセスできます.nav.nav-tabs。また、この方法では、特定の ID を持つタブだけでなく、ページ上のすべてのタブ セットにアクセスできます。

例：

$(document).ready(function() {
     $(".nav.nav-tabs li").click(function() {
        $("#tabs li").removeClass('active'); 
        $(this).addClass("active");
        $(".tab_content").hide();
        $(selected_tab).fadeIn();
        var selected_tab = $(this).find("a").attr("href");
    });
});

または、 の親要素の id を指定できますli。

<ul class="nav nav-tabs" id="tabs">
于 2012-11-20T08:00:59.023 に答える
-1

すべてのコードは#tabsを参照していますが、「ul」には「tabs」のIDがありません。

于 2012-11-20T07:57:22.383 に答える