0

タブ 1 とタブ 2 は期待どおりに表示および非表示になりますが、ネストされた div は表示されません。Tab 1 div/Tab 2 div とネストされた div を表示/非表示にするようにスクリプトを変更するにはどうすればよいですか。

脚本

$(document).ready(function() {
        $("#content div").hide(); // Initially hide all content
        $("#vtabs li:first").attr("id", "current"); // Activate first tab
        $("#content div:first").fadeIn(); // Show first tab content
        $('#vtabs a').click(function(e) {
            e.preventDefault();
            if ($(this).closest("li").attr("id") == "current") { //detection for current tab
                return
            }
            else {
                $("#content div").hide(); //Hide all content
                $("#vtabs li").attr("id", ""); //Reset id's
                $(this).parent().attr("id", "current"); // Activate this
                $('#' + $(this).attr('name')).fadeIn(); // Show content for current tab
            }
        });
    });
    (function() {
        var bsa = document.createElement('script');
        bsa.async = true;
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bsa);
    })();​

html

<link rel="stylesheet" href="css/tabs3.css" type="text/css" />
</head>
<body>
    <div id="header">site title</div>
    <div id="vtabs">
        <ul>
            <li>
                <a href="#" name="tab1">By Service</a>
            </li>
            <li>
                <a href="#" name="tab2">By Client</a>
                <br />
            </li>
        </ul>
    </div>
    <div id="content">
        <div id="tab1">Tab 1
            <br />
            <div>Tab 1 nested div</div>
        </div>
        <div id="tab2">Tab 2
            <br />
            <div>Tab 2 nested div</div>
        </div>
4

1 に答える 1

0

ネストされた div を表示するコードのどこにもありません。コンテナ div にクラスを指定して、たとえば tab_contents と呼ぶことをお勧めします。そのようです

<div id="tab1" class="tab_contents">

そして、この行 $("#content div").hide();を $(".tab_contents").hide();両方の場所でに変更します。問題は、#content 内のすべての div を非表示にしていることですが、ネストされた div ではなく、コンテナー div のみをフェードインします。コンテナの div のみを非表示にします。

于 2012-06-30T18:15:26.317 に答える