Javascript 计时/循环问题？

Question

我这里有这段代码，它从数据库中获取一些运动统计数据，并对其进行更新 - 我正试图在检测到变化时发出警报(#scorealert div)。如果只有一个分数发生了变化，这就可以正常工作。当有多个更改时，它会显示错误的名称 - 它会一直显示最后一个值，而不是更改名称。

仍然是 javascript/ajax 和学习的初学者..请保持温柔。

谢谢!

function getscores() {

  $.post("/get_live_scores.php", {e: <?=$entryid;?>}, function(celldata) {

    data = jQuery.parseJSON(celldata);
    $.each(data, function(i,item) {
        var pname = data[i].pname;
        var cell = data[i].key;
        var save_val = data[i].save_val;
        var wins = data[i].wins;
        var shutouts = data[i].shutouts;
        var goals = data[i].goals;
        var assists = data[i].assists;
        var ht = data[i].ht;
        var gwg = data[i].gwg;

        if ($('td#'+cell+'_goals').text() < goals) {
            $('div#scorealert').html('Goal by '+data[i].pname);
            $('div#scorealert').animate({left: '0px'});
            $('div#scorealert').delay(4000).animate({left: '-300px'});
        }
        updatecell(pname, cell, save_val, wins, shutouts, goals, assists, ht, gwg); 


    });

    updatetotal();
  });
}    

Answer 1

我会说实话；我不明白为什么它只显示第一个。据我所知，它应该显示最后一个。原因是:在每个循环中，您在 div 上调用 .html()，这将用新内容替换该 alert div 的内容。除非 .delay() 函数也中断了它的计时？

我会使用 .append() 或其他非破坏性 DOM 添加函数将您的进球得分手(等)添加到 div，然后在循环结束后调用动画(包含所有得分手)。

[编辑以添加评论讨论的结果:]

由于 .append() 将它们全部添加到同一个 div(这不是预期的效果)，将它们保存在不同的警报容器中的方法是根据需要动态创建这些容器。