JQuery Mobile を使用して、サイドバー内に 2 レベルのナビゲーションを実装したいと考えています。
私が達成しようとしていることを説明するために、3 つのカテゴリ リンクがあり、(たとえば) 各カテゴリに 3 つのリンクがあるとします。
カテゴリ 1 - リンク 1 - リンク 2 - リンク 3
カテゴリ 2 - リンク 1 - リンク 2 - リンク 3
カテゴリ 3 - リンク 1 - リンク 2 - リンク 3
また、ユーザーがいずれかのページにアクセスするために 2 つのリンクをブラウズする必要がないようにしたいと考えています。
このルートを使用していくつかの方法を試しました。
data-role="collapsible" を使用して、サイドバーの各カテゴリのヘッダーを作成しようとして、ユーザーはそのいずれかを展開して第 2 レベルのリンクをクリックできます
一連の選択ドロップダウン (カテゴリごと) と JavaScript を使用して、いずれかの選択肢を選択するとページが変更されます。
問題は、「メインコンテンツ」ページで使用すると両方の方法がうまく機能しますが、コンテンツセカンダリコンテナーに配置するとすぐに、どちらも機能しないことです (折りたたみ可能なコンテンツは常に展開され、javascript は表示されません)。発火する)
(a)私が抱えている上記の問題の解決策、または(b)この猫の皮を剥ぐ別の方法を提案できますか?
編集: セカンダリ ブロック内の折りたたみ可能な問題を整理しようとしている私の以前の投稿を見ることができます。 JQuery Mobile を使用して、セカンダリ div クラス内に折りたたみ可能なコンテンツを含めることは可能ですか?
また、サンプル コードを含む JSFiddle がhttp://jsfiddle.net/vinomarky/xfcdF/にありますが、Fiddle はセカンダリ div では機能しないようで、ウィンドウを展開してもサイドバーが正しくレンダリングされません。