2017-10-06 9 views
-2

のdivにそれらを追加する必要があり私はすべての3李さんを分割し、私は一般的なリストを持っている

<ul> 
    <li>list item1</li> 
    <li>list item2</li> 
    <li>list item3</li> 
    <li>list item4</li> 
    <li>list item5</li> 
    <li>list item6</li> 
</ul> 

しかし、私がやりたいことは、私はこれを使用している

<div class="list"> 
    <ul> 
    <li>list item1</li> 
    <li>list item2</li> 
    <li>list item3</li> 

    </ul> 
</div> 

<div class="list"> 
    <ul> 
    <li>list item4</li> 
    <li>list item5</li> 
    <li>list item6</li> 

</ul> 

ですスクリプトのみが表示されます2 li 1の要素div私の要求は3 liになりますdiv

$('ul > li:nth-child(2n-1)').each(function() { 
    $(this).next().add(this).wrapAll('<div class="list"><ul></ul></div>'); 
}).eq(0).closest('div').unwrap(); 
+0

こんにちはファルハードは私にこの問題を解決するのを助けてくれますか?私は何をしているのですか? – ASHU

+0

リストは動的に生成されていますか?たとえば、PHPやJavaのバックエンドでは? –

+0

2n-1は2回ごとに循環するので、3n-1を使用する必要があります。 – Salketer

答えて

3

$('ul > li:nth-child(3n-2)').each(function() { 
 
    $(this).next().add($(this).next().next()).add(this).wrapAll('<div class="list"><ul></ul></div>'); 
 
}).eq(0).closest('div').unwrap();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>list item1</li> 
 
    <li>list item2</li> 
 
    <li>list item3</li> 
 
    <li>list item4</li> 
 
    <li>list item5</li> 
 
    <li>list item6</li> 
 
</ul>

キーは、2次sibblingsを設定し、ラップに追加し、右側の要素(第4回というように第1回を、)ターゲットに3N-2を使用することでした。

あなたは非常に近くでした。

+0

実際に私は1つのdivでこれを使って1つのdivにしたい – ASHU

+0

それは、コードスニペットを実行する証明がある... – Salketer

+0

https://jsfiddle.net/sensex00007/ あなたはここでそれを食べることができます...ここで修正してください。 – ASHU

関連する問題