2

問題を検索したり説明したりするのは難しいですが、試してみます

基本的に私は定義されたjqueryタブを持っています:

<div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
    <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#Summary" title="Summary">Summary</a>
        </li>
        <li class="ui-state-default ui-corner-top"><a href="content.php?div=Products" title="Products">Products</a>
        </li>
        <li class="ui-state-default ui-corner-top"><a href="login.php" title="Login">Login</a>
        </li>
    </ul>
    <div id="Summary" class="ui-tabs-panel ui-widget-content ui-corner-bottom" style="font-size: 85%;" align="center">
        ...
    </div>
</div>

[概要] タブには、2 つのアコーディオンが定義されています。

<td id="product_summary" valign="top" align="center">
    <div id="release_info" style="display: block; width: 99%;" class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
        <h3>General Information</h3>
        <div>
            ...
        </div>

        <h3>Description information</h3>
        <div>
            ...
        </div>
    </div>
</td>
<td id="" style="width: 280px;" valign="top" style="overflow: hidden;">
    <div id="controls" class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
        <h3 class="ui-accordion-header"><a href="#">Search</a></h3>
        <div class="ui-accordion-content">
            ....
        </div>

        <h3 class="ui-accordion-header"><a href="#">Controls</a></h3>
        <div>
            ...
        </div>
    </div>
</td>

ドキュメントの先頭で、次のように定義しています。

$(function() {
    $("#controls, #release_info").accordion({
       active: 0,
       heightStyle: "fill",
       autoHeight: false,            
       navigation: true,            
       collapsible: true,
       create: function(event, ui) { $("#controls, #release_info").show(); }
    });
    $('#controls').accordion({
       width: 280,
    });

    $( "#tabs" ).tabs({
        cache: true,
        select: function(event, ui) {
            window.location.hash = ui.tab.hash;
        }
    });
});

アコーディオンが定義されている [概要] タブにページを読み込むと、すべてが期待どおりになります。しかし、[製品] タブ (content.php へのリンク) でデータをリロードすると、2 つ目のアコーディオンだけがページ全体の長さを表示します。

ご覧のとおり、タブにキャッシュを使用しているため、[概要] タブに戻るときに何らかの形でアコーディオンを再度アクティブにする必要があると思います。Summary tab = index.php

4

2 に答える 2

0

最初にタブを作成する

$("#tabs").tabs();

次に、タブでアコーディオンを作成します

 $("#" + accordionID).accordion();

その後、それは動作します

于 2013-07-26T10:06:14.903 に答える