0

順序付けされていないリストのグループがあり、各リストグループを3つのサブグループに動的に分割しようとしています。これまでのところ私はこれを持っています：

var uls = $("ul > li");
for(var i = 0; i < uls.length; i+=3) {
uls.slice(i, i+3).wrapAll("<ul class='new'></ul>");
}

...以下のサンプルHTMLの場合

<h2>Group 1</h2>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>

<h2>Group 2</h2>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
<li>Item 7</li>
</ul>

私が抱えている問題は、私のコード<ul>がグループに関係なくすべてのsをひとまとめにしていることです。つまり、「グループ1」「グループ2」を使用しようとし.each(function() {まし$("ul > li")たが、エラーが発生します。また、.lengthの後に各関数を下に移動しようとしましたが、それも機能しませんでした。

したがって、最終的なHTMLは次のようになります。

<h2>Group 1</h2>
<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

<ul>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>

<h2>Group 2</h2>
    <ul>
etc...

私のフィドルはここにありますが、ご覧のとおり、まだ完全には機能していません。

4

1 に答える 1

3

どう？http://jsfiddle.net/4Bms6/

$('ul').each(function(){
    var uls = $("li", this);

    for(var i = 0; i < uls.length; i+=3) {

    var lis = $("li", this);

        uls.slice(i, i+3).wrapAll("<ul class='new'></ul>");
    }
});​

誤ったグループ化を取得した理由は、すべてのliを収集することから始めたためです（「ul> li」は、任意のulの子であるすべてのliに相当します）。あなたがすべきだったのは、各ulの子であるすべてのliを選択し、グループ化を実行してから、次のulに進むことです。

于 2012-11-21T01:55:52.103 に答える