3

あいまいなタイトルで申し訳ありませんが、問題をうまく説明する適切なタイトルが見つかりませんでした。

問題: リストを切り替えるコードを書きました。それは私が望むように機能します。「headcategory」をクリックすると、サブカテゴリなどが開きます。 headcategory を初めてクリックすると問題が発生し、すべてのリストが開きますが、これは私が望んでいるものではありません。閉じて再度開くと、本来あるべき方法で機能します。なぜそれができるのかを調べようとしていますが、手がかりがありません。誰かが私を助けることができれば、彼/彼女は大歓迎です。

JQuery コード。

$(document).ready(function()
{
$('ul.subcat').hide();

$('li').click(function(event)
{ 
    event.stopPropagation();
    $('ul', this).toggle(); 

});
});

HTMLコード

<ul class="headcat">
  <li>item 1
  <ul class="subcat">
    <li>subitem 1
    <ul class="subcat">
      <li>subsubitem 1
      <ul class="subcat">
        <li><p>text</p></li>
      </ul>
      </li>
      <li>subsubitem 2
      <ul class="subcat">
        <li><p>text</p></li>
        <li>subsubsubitem 1
        <ul class="subcat">
          <li><p>text</p></li>
        </ul>
        </li>
        <li>subsubsubitem 2</li>
      </ul>
      </li>
    </ul>
    </li>
    <li>item 2</li>
  </ul>
  </li>
</ul>  
4

2 に答える 2

4

現在クリックされている の直接の子孫のみを選択する必要がありますli。これを試してください:

$(this).children("ul").toggle();

以下も機能しますが、その>前にプライマリ要素なしで子孫セレクターを使用することはベスト プラクティスとは見なされません。

$('> ul', this).toggle(); 

フィドルの例

于 2012-05-01T13:28:10.577 に答える
0

またはsubcat、init でのみ最初のものを非表示にしてみてください。

$('ul.subcat:first').hide();

デモはこちら: http://jsfiddle.net/kv4dT/

于 2012-05-01T13:29:54.657 に答える