如何在 5 秒后删除动态添加的元素？答案

【问题标题】：How do I remove a dynamically added element after 5 seconds?如何在 5 秒后删除动态添加的元素？
【发布时间】：2015-08-05 02:40:03
【问题描述】：

我正在制作一个简单的游戏，用户应该点击苍蝇将它们从屏幕上移除。猫掉落时用户不应该点击它，我希望猫 gif 在 5 秒后消失（从 DOM 中删除）。

如果之前已经回答过这个问题，我深表歉意。我很难解决这个问题，因为我的经验非常有限。这是我的第一个问题/帖子。感谢您的所有反馈:)！

$('.square').each(function(i){
    if (($('.square').eq(i)).has(".cat")){
        setTimeout(function(){
            $('.square').eq(i).find('img').remove();
    }, 5000);       
};

^这是我尝试编写的代码... .square 类是组成表格的正方形，例如 div 的网格... 而 .cat 类指的是丢弃的图像。

问题是可以同时在屏幕上放置多只猫。

我需要页面识别猫何时被丢弃，设置超时 5 秒，然后在 5 秒后从页面中删除该特定猫。

感谢您的帮助:)！

var randomize = function (x) {return Math.floor(Math.random()*x)};

var startFunk = function(){
    setTimeout(function(){
        $('.square:empty')[randomize(($('.square:empty').length))].innerHTML = dropArray[randomize(dropArray.length)];
        startFunk();
    }, 500);
};

【问题讨论】：

您可能希望在实际丢弃猫的任何代码中设置一个 setTimeout
您在正确的轨道上，但您需要向我们展示您的放置代码。
var randomize = function (x) {return Math.floor(Math.random()*x)}; var 计时器 = 550; var startFunk = function(){ setTimeout(function(){ $('.square:empty')[randomize(($('.square:empty').length))].innerHTML = dropArray[randomize(dropArray.length )]; // if (timer>100){ timer -= 1; // }; startFunk(); }, timer); };
对不起...我对这个很陌生...即将这样做:)

标签： javascript jquery each settimeout

【解决方案1】：

可能有帮助

$('.square').each(function(i){
    if ($(this).find('.cat').length > 0){
        $(this).find('.cat').delay(5000).fadeOut(0, function(){
            // change ..^... with img 
            $(this).remove();
        });
    }
});

DEMO Here

【讨论】：

@TreyHarding 到你想做的事情.. 如果你放弃 .cat 类并想在 5 秒后删除它。答案是肯定的 .. 每次删除 .cat 时都应该运行这段代码
@TreyHarding 你也可以玩 .fadeOut(0, function(){});如果需要，将 0 更改为 1000 或 2000 以获得一个不错的 fadeOut() .. 祝你好运:)
这是一个多么棒的社区！我非常感谢您的回复。谢谢@Mohamed-Yousef！

【解决方案2】：

var startFunk = function () {
    setTimeout(function () {
        var sqr = $('.square:empty')[randomize(($('.square:empty').length))];
        sqr.innerHTML = dropArray[randomize(dropArray.length)];
        sqr.has('.cat').delay(5000).empty();
        startFunk();
    }, 500);
};

并去掉 $('.square').each(function(i){... 部分。

【讨论】：

谢谢武士。我也去看看这个！很高兴得到这么多帮助！