javascript - for loop and animation, can't use variable since changing due to closure -
i have code:
var newtr = '<tr class=".small"></tr>'; var i=300, v=0; (var product in products){ i=i+300; v++; var newtd+v = '<td>'+'img'+'</td>'+ '<td>'+products[product].partnumber + ' ' + products[product].description+'</td>'+ '<td class="productprice">' + todollars(products[product].price) + '</td>'+ '<td class="productqty">'+products[product].qty+'</td>'+ '<td>'+ products[product].price * products[product].qty+'</td>'+ '<td><button class="removeproductclass">x</button></td>'; $(newtr) .delay(i) .insertafter(self.carttableheader) .switchclass( "small", "big", 500, "easeinoutquad") .queue(function(){ $(this).append(newtd) .children() .hide() .fadeto(1000, 1); $(this).dequeue(); }) .queue(function(){ self.calcsubtotal(); $(this).dequeue(); }); } }
the problem end same value newtd variable since closure using last value set on newtd since animation happens later, when loop completed..
how can 1 overcome this? :(
thanks reading,
sean.
wrap code in question in self executing function so:
(function(newtd){ $(newtr) .delay(i) .insertafter(self.carttableheader) .switchclass( "small", "big", 500, "easeinoutquad") .queue(function(){ $(this).append(newtd) .children() .hide() .fadeto(1000, 1); $(this).dequeue(); }) .queue(function(){ self.calcsubtotal(); $(this).dequeue(); }); })(newtd);
Comments
Post a Comment