JQuery добавить или нарезать - PullRequest
1 голос
/ 10 января 2010

Я пытаюсь обернуть определенное количество элементов в div. Проблема в том, что количество элементов может варьироваться в зависимости от ввода пользователя. Таким образом, количество элементов может быть 2, 3, 4 или даже больше. У меня есть переменная, которая говорит мне, сколько элементов следует обернуть. Так, например, моя страница может иметь это:

<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>

Теперь мне нужно обернуть их в другой div, основываясь на моей переменной. Итак, если бы моя переменная содержала значение 3, это выглядело бы так:

   <div class="testing"> 
    <div class="test"></div>
    <div class="test"></div>
    <div class="test"></div>   
   </div>

   <div class="testing">
    <div class="test"></div>
    <div class="test"></div>
    <div class="test"></div>
   </div>

Я использовал этот код:

$(this).add($(this).next())
       .add($(this).next().next())
       .wrapAll('<div class="testing"></div>');

Проблема в том, что мне нужно знать, сколько элементов будет там. Есть ли динамичный способ сделать это? Я также увидел функцию slice и попытался использовать ее так:

for(var i=0;i<img_cnt;i+=img_row){
    obj.children().slice(i,i+img_row).wrapAll('<div class="row"></div>');
}

Хотя это не работает. У меня 8 div с. Это должно быть объединение 3, поэтому у меня должно быть 3 новых div с 3 в первых 2 и 2 в последнем, так как всего 8 div с. Тем не менее, я получаю 3 div с в первых новых div, затем следующие 2 div с не обертываются вообще, а затем последние 3 div с обертываются в новый div. Я не уверен, почему это не правильно. У вас есть идеи, как это сделать или, может быть, даже лучший метод?

1 Ответ

5 голосов
/ 10 января 2010

Ваш код не работает, потому что children меняется. Попробуйте использовать slice на постоянном наборе:

var all = $('.test'); 
for(i=0; i < all.length; i += img_row) {
   all.slice(i, i + img_row).wrapAll('<div class="row" />'); 
}

Пример: http://jsbin.com/upaji

...