0

カテゴリにグループ化されたブックマークの階層リストになる画面を作成しようとしています。カテゴリを拡大/縮小して、そのカテゴリのブックマークを表示または非表示にすることができます。今、私はUIに取り組んでいて、初めてjqueryを使用しています（そしてそれが大好きです）。

私が使用している方法論は、アコーディオンのようなものですが、同時に複数のセクションを開くことができ、複数のレベルが深くなる可能性があります（アコーディオンは1つのレベルのみをサポートします）。カテゴリごとに、ブックマークのコレクション（通常は<ul>）であるDOMの次の要素を表示または非表示にするフォルダの画像を含むdivがあります。例えば：

<div class="categoryLine" id="d4">
    <img class="folder"....>
    Fourth Menu Item
</div>
<ul id="u4">
    <li id="l41">

ユーザーがクリックした画像の周囲のdivにcategoryLineのクラスがある場所を使用して閉じる要素を選択し、$(this).parentsUntil('categoryLine').next().toggle(transitionSpeed);表示/非表示にするのはそのdivに続く要素です。

問題は最も複雑な（最も深い階層）部分にあり、あるべきではないものが隠されており、未知の理由で再び現れています。

ここで「実用的な」例を見ることができます。関連するタグIDを指定し、デバッグアラートを入力して、クリックされた要素と開閉する要素のIDを表示します（これを確認するには、ソースを表示してください）。

  1. 「4番目のメニュー項目」のフォルダをクリックして、そのカテゴリを再表示します。サブ1、サブ2、およびサブ3が表示されるはずです。
  2. 「4番目のメニュー項目サブ1」のフォルダをクリックします。サブ1が展開されているはずですが、サブ2はカテゴリ行を含めて完全に消えています。これが私が解決しようとしている謎です。サブ1をクリックすると、「カテゴリ「d41」から「u411」を切り替える」と正しく表示されますが、<ul> u411が消えると、サブ2もすべて消えます。同様に、フォルダをクリックしてsub2を展開すると、sub3が消えます。

私はこれをまったく異なる方法で実装することにオープンです（これも私の最初のjquery実験です）。また、アコーディオンのような深い階層ではなく、階層をサポートしている限り、一度に1つのカテゴリしか開くことができないソリューションも検討したいと思います。

前もって感謝します。

4

1 に答える 1

1

jQueryは次のように説明parentsUntil()します。

説明：セレクターによって一致した要素までの、一致した要素の現在のセット内の各要素の祖先を取得します。

ここで注意すべき重要な部分は、を選択していないということです.categoryLine。でもそれを含めたいようです。closest()代わりに使用すれば機能するはずです。

$(this).closest('.categoryLine').next().toggle(transitionSpeed);

今後の参考のための補足として。('categoryLine')セレクターではありません。.通常、、#または要素タイプ、つまりを含める必要がありますdiv。ただし、より高度な方法があります。jQueryセレクターについて読みたいと思うかもしれません。

于 2010-02-15T06:03:45.377 に答える