0

h5のリストがあります:

<div id="accordion"><h5>One</h5>
<p>Lorem ipsum dolor sit amet</p>
<h5>Two</h5>
<p>Lorem ipsum dolor sit amet.</p>
<h5>Three</h5>
<p>Lorem ipsum dolor sit amet</p>
<h5>Four</h5>
<p>Lorem ipsum dolor sit amet</p>
<h5>Five</h5>
<p>Lorem ipsum dolor sit amet</p></div>

そして、最初の要素を含むjQuery UIアコーディオンを使用してそれらをアコーディオンに変えたいので、各h5の間にコンテンツをラップしたいと思います。.after() と .before() を使用すると、の終了タグと開始タグの両方が</h5>取得され、最初の要素を取得してその上に終了タグを挿入しないようにする方法もわかりません。

これまでのところ、明らかに機能していないもの:

var insert = true;
$("#accordion h5").each(function(event) {
    // All of them have a div immediatly after it.
    $(this).after("<div>");
    if (insert === true) {
        insert = false;
    } else {
        $(this).before("</div>");
    }
});

明確にするために、私の出力はこのようになりたいのですが、コンテンツが何でもかまいませんので、常に p タグがあるとは限りません。

<div id="accordion">
<h5>One</h5>
<div><p>Lorem ipsum dolor sit amet</p></div>
<h5>Two</h5>
<div><p>Lorem ipsum dolor sit amet.</p></div>
<h5>Three</h5>
<div><p>Lorem ipsum dolor sit amet</p></div>
...
</div>
4

4 に答える 4

0

各関数で.not()セレクターを使用してから、.not()内で:eq(0)セレクターを使用できます。0は最初の要素のインデックスです。あなたの場合:

$("#accordion h5").not(':eq(0)').each(function(event) {
    //your code
});

それが役に立てば幸い

于 2012-11-22T08:18:20.543 に答える
0

このセレクターを使用して、最初の h5 以外のすべての h5 を取得します。

$('#accordion h5:not(:first)')
于 2012-11-22T08:11:32.190 に答える
0

これがあなたが望むものだと思います:

$('#accordion > h5').each(function() {
    $(this).nextUntil('h5').wrapAll('<div/>');
});

h5これは、それぞれの間のすべてのコンテンツをラップしますdiv

ここにフィドルがあります

編集

コンテンツがないときにa を挿入するdivには、次のような単純な条件を追加するだけです。

$this = $(this); 
if ($this.next('h5').length) {
  $this.after('<div/>');
} else {
  $this.nextUntil('h5').wrapAll('<div/>');
}

これは基本的に、次の要素が a の場合h5(つまり、コンテンツがない場合)、空の を挿入し、そうでない場合は次の要素まですべてのコンテンツを adivでラップします。h5div

于 2012-11-22T08:17:54.190 に答える
0

ラップ機能が必要です:

$("#accordion h5").wrap('<div />');

ドキュメント: http://api.jquery.com/wrap/

于 2012-11-22T08:10:05.190 に答える