Question

我有一个div，我希望能够将子元素添加到顶部并从底部动态删除子元素。有点像rss ticker。 母公司不断有新的孩子。 有一个条件可以测试孩子的数量，然后在最后一个孩子达到所需的最大长度的孩子时将其删除。 这是通过setInterval（）完成的。

setInterval(function(){ 
    var newbox = "<div class='child animated bounceInDown'></div>" 
    $(newbox).prependTo('#container').hide().slideDown(500); 
    var dlength = $('.child').length; 
    console.log(dlength); 

    if (dlength >=5){ 
     $(".child:last").fadeOut(); 
    } 
}, 2000); 

目前与我的代码，我可以删除最后一个子div通过使用填充最大所需长度的父div的计数器。

问题是它只在第一个时间间隔内删除最后一个div。 我将计数记录到控制台并可以看到计数增量，所以我的情况应该会触发。

我的想法是，我的问题是由于没有事件代表团。实质上，当我尝试删除它时，div不在DOM中。话虽如此，我不确定是否需要听父母的事件或附加处理程序。 任何想法？

这里是小提琴例如：

http://jsfiddle.net/luskbo/tcq8kuy6/9/

Answer 1

问题是你一直淡出在DOM的最后一个元素，而不是最后一个可见的元素。就像说，你总是在淡化同样的元素。

$(".child:visible:last").fadeOut();应该的技巧。（它在JSFiddle中工作）添加:visible选择器。

Anant建议的另一种选择是从DOM中删除元素，而不是将其删除，这取决于您可能想要实现的内容。如果你不需要元素留在DOM中，也许这是一个很好的做法，将其删除。 。

$(".child:visible:last").fadeOut(400,function(){ 
    $(this).remove(); 
});