Pregunta
Estoy tratando de envolver un cierto número de elementos en una div
. El problema es que el número de elementos puede variar en función de la entrada del usuario. Así el número de elementos podría ser 2, 3, 4, o incluso más. Tengo una variable que me dice cómo deben ser envueltos muchos elementos. Así, por ejemplo, mi página puede tener este aspecto:
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
Ahora tengo que envolver los de otro div
basado en mi variable. Por lo tanto, si mi variables llevó a cabo un valor de 3, que se vería así:
<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>
Yo estaba usando este código:
$(this).add($(this).next())
.add($(this).next().next())
.wrapAll('<div class="testing"></div>');
El problema con esto es que necesitaría saber cuántos elementos van a estar allí. ¿Hay una manera dinámica para hacer esto? También vi la función slice
y trató de utilizar de esta manera:
for(var i=0;i<img_cnt;i+=img_row){
obj.children().slice(i,i+img_row).wrapAll('<div class="row"></div>');
}
No está funcionando, sin embargo. Tengo 8 div
s. Cabe terminando 3 juntos, así que debe tener 3 nuevos div
s con 3 en la primera 2 y 2 en el pasado, ya que sólo hay 8 div
s. Sin embargo, consigo 3 div
s en el primer nuevo div
, a continuación, los próximos 2 div
s no se envuelven en absoluto, y luego los últimos 3 div
s están envueltos en una nueva div
. No estoy seguro de por qué no está envolviendo bien. ¿Tiene alguna idea de cómo hacer esto o tal vez incluso un método mejor?
Solución
El código no está funcionando porque children
está cambiando. Trate de usar slice
en un conjunto constante:
var all = $('.test');
for(i=0; i < all.length; i += img_row) {
all.slice(i, i + img_row).wrapAll('<div class="row" />');
}
Ejemplo: http://jsbin.com/upaji