我有一个jquery操作的帖子列表,当删除表中的一个或多个帖子行时,我希望逐行fadeOut然后从DOM中删除,删除一行的代码如下:
$('.post#' + postID).parent('tr').fadeOut('slow', function() { $('.post#' +postID).parent('tr').remove(); });它适用于单行删除,但是当我将上面的代码部分放在for循环中时:
for(var i = 0; i < selectedPostIds.length; i ++) { $('.post#' + selectedPostIds[i]).parent('tr').fadeOut('slow', function() { $('.post#' + selectedPostIds[i]).parent('tr').remove(); }); }动画仍然有效,但DOM元素,即帖子行没有被删除。 有什么建议么? 提前致谢。
I have a post list manipulated by jquery, when deleting one or more of the post row(s) in the table, I want the row(s) to fadeOut gradually then being removed from DOM, the code for deleting one row is as follows:
$('.post#' + postID).parent('tr').fadeOut('slow', function() { $('.post#' +postID).parent('tr').remove(); });and it works perfectly for single row deletion, but when I put the above section of code in a for loop:
for(var i = 0; i < selectedPostIds.length; i ++) { $('.post#' + selectedPostIds[i]).parent('tr').fadeOut('slow', function() { $('.post#' + selectedPostIds[i]).parent('tr').remove(); }); }The animation still works, but the DOM elements, i.e. the post rows didn't get removed. Any suggestions? Thanks in advance.
最满意答案
这是因为在循环中错误地使用了闭包变量。
在回调内部, this是指tr元素,因此您可以使用
for (var i = 0; i < selectedPostIds.length; i++) { $('.post#' + selectedPostIds[i]).parent('tr').fadeOut('slow', function () { $(this).remove(); }); }另见
在循环中创建闭包:一个常见的错误It is because of the wrong use of a closure variable in a loop.
Inside the callback this refers to the tr element, so you can use
for (var i = 0; i < selectedPostIds.length; i++) { $('.post#' + selectedPostIds[i]).parent('tr').fadeOut('slow', function () { $(this).remove(); }); }Also see
Creating closures in loops: A common mistake更多推荐
发布评论