2014-10-10 2 views
0

У меня есть 100 элементов - теги span span.Использовать jquery для добавления списка элементов по определенному счету

Как бы добавить каждый элемент (5 за раз) в новый внутренний div, используя jquery каждый и добавить методы?

$.each(items, function (x, result) { 

    append to outer-div 5 at a time, each set of spans is inside an inner-div 

} 

<div class="outer-div> 
    <div class="inner-div"> 
    <span>1</span> 
    <span>2</span> 
    <span>3</span> 
    ... etc. 
    <span>5</span> 
    </div> 
    <div class="inner-div> 
    <span>11</span> 
    <span>12</span> 
    <span>13</span> 
    ... etc. 
    <span>5</span> 
    </div> 
    ...etc... 
</div> 
+0

Итак, что вы хотите сгруппировать 5 по 5 всех существующих 'span' в 'outer-div' в' inner-div '? Или вы хотите сгенерировать все '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' с нуля? –

ответ

0

Нечто подобное будет использовать числовой идентификатор, чтобы отслеживать, сколько циклов вы делаете, создать контейнер, когда i является 1, добавление каждого диапазона элемента в документе последней .inner-div и сброс счетчик, когда он достигает своего предела, так что вызовет новую .inner-div быть создан:

var i = 1; 
$.each(items, function(x, result) { 
    // create the container div 
    if(i == 1) { 
     $('<div/>').addClass('inner-div').appendTo('.outer-div'); 
    } 
    // create child and add to container 
    $('.inner-div') 
     .last() 
     .append(
      $('<span/>').text(result) 
     ); 

    // reset the counter when limit reached 
    if(i == 5) { 
     i = 1; 
    } else { 
     // increment counter 
     i++; 
    }  
}); 

Вот демо: fiddle