1

ページを開くために使用されるリンクに応じて、異なるアクティブなパネルが表示されるようにアコーディオンを設定する方法を理解しようとしています。

私が取り組んでいるページ ( http://testing.xenongroupadmin.com/lms/admin/index.html ) を見ると、上部にナビゲーション バーが表示されます。選択項目にカーソルを合わせると、ドロップダウン ボックスが表示されます。

最初のメニュー項目「コース教材」には、「ワークショップ」、「遠隔学習」、「学習リソース」の 3 つのオプションが表示されます。これらのリンクのいずれかをクリックすると、目的のページが開き、jQuery アコーディオンが表示されます。このアコーディオンのタイトルは、ナビゲーション バーの 3 つのオプションに対応しています。

つまり、要点を言えば、どのリンクがクリックされたかに応じて、適切なアコーディオン タブが開くようにすることです。したがって、ナビゲーション メニューで [遠隔学習] をクリックすると、[教材] ページがロードされ、遠隔学習のアコーディオン タブが開きます。

サブメニューからオプションを選択せず​​に「コース教材」リンクをクリックすると、すべてのアコーディオン タブが閉じます。

誰でも助けることができますか？サーバー側のスクリプトが必要な場合、私のサーバーは PHP で使用するように設定されています。必要に応じて Ajax を使用することもできます。

ありがとう！

4

3 に答える 3

1

アコーディオン オプション'active'を使用できます。

$('#accordion').accordion({
    active : 0
});

-1 は閉鎖、ワークショップは 0、遠隔学習は 1、学習リソースは 2

于 2012-11-20T09:47:31.697 に答える
1

サブメニューに、開くパネルを示すハッシュタグを付けて、materials.html にリンクさせます。「materials.html#workshop-slides」と同様に、Javascript を使用して、ドキュメントの準備が整った場所で location.hash を解析し、適切なパネルを開きます。

于 2012-11-20T09:54:29.480 に答える
0

JavaScriptでこれを行う方法。アクティブなタブの参照を #tab-0 として URL に渡します (番号はタブのインデックスになります)。始めるための大まかな実装を次に示します。

$(document).ready(function() {
    var a =0;
    if(location.href.indexOf("#tab-1")) a = 1;
    if(location.href.indexOf("#tab-2")) a = 2;
    $('#accordion').accordion({collapsible : true, active : a});  
});

PHP から実行する場合は、「none」の値を適切なタブ インデックスに置き換えて開く必要があります。

于 2012-11-20T09:48:05.757 に答える