4

<ul> <li>ネストされたタグの jQuery アコーディオンを表示しようとしています...

アコーディオンを表示するこのサイトを見つけました: http://jqueryui.com/demos/accordion/

残念ながら、<h3>タグをヘッダーとして使用しています。

私の実際のコードでは、<ul><li>タグしかありませんでした。

私のコードスタイルは次のようになります。

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
    <li>Black tea</li>
    <li>Green tea
      <ul>
      <li>China</li>
      <li>Africa</li>
      </ul>
    </li>
    </ul>
  </li>
  <li>Milk</li>
</ul>
4

1 に答える 1

0

私の知る限り、例のように文書を構成する必要があります。
jQuery は、アンカーを含むヘッダーを検索し、その後に div ブロックなどを検索します ...

例:

<div id="accordion">
    <h3><a href="#">First header</a></h3>
    <div>First content</div>
    <h3><a href="#">Second header</a></h3>
    <div>Second content</div>
</div>

したがって、jQuery のマークアップを使用する必要があります。そうしないと、jQuery はコンテンツを認識しません。
リストのもう 1 つの問題<ul>は、jQuery がどの部分がヘッダーで、どの部分がコンテンツであるかを認識できないことです。

この時点で、いくつかのオプションがあります。

  • jQuery で対応するコード行を見つけて編集できます (非推奨)。
  • 独自のアコーディオンを作成できます (オリジナルに基づく)
  • <ul>(本当にリストが必要な場合)実行時にタグ<ul><li>タグを対応する「jQueryタグ」と交換できます
  • jQuery のマークアップを使用する (推奨)

よろしくお願いします

于 2012-10-01T21:28:57.237 に答える