javascript - 在 Firefox 中显示重复记录

Question

我在一家在线音乐商店工作。有诸如 等按钮myplaylists...mydownloads单击这些按钮后，歌曲列表会相应地出现在网格视图中。

问题是，当我快速单击按钮两次时，列表会出现两次，例如 1..4..8 1..4..8，如果我快速单击三次，则会出现三次。显示列表的功能使用append()将歌曲添加到列表中。

这些事情只发生在 Firefox 上

我无法弄清楚问题所在。

function fillMyMusicSongGrid
{
// code to fetch data from the database
embedSongGrid(.....);//displays the grid
}

embedSongGrid(.....)
{
  //displays the grid
tableContent = '...............'
$(tableCont).appendTo('table#songList');
}

Answer 1

如果我猜对了，按下这些按钮会使 Ajax 回调到服务器以获取信息，可能是一个 JSON 数组。然后，您将这些和它们循环append()到适当的 div。要么，要么你得到 HTML 并附加它。

简单的解决方案：empty()在添加之前就可以了：

$.ajax({
  ...
  success: function(data) {
    $("#songlist").empty();
    for (song in data) {
      $("#songlist").append(...);
    }
  }
});

或者

$.ajax({
  ...
  success: function(html) {
    $("#songlist").html(html);
  }
});

Answer 2

尝试

$(tableCont).empty();
$(tableCont).appendTo('table#songList');

代替

$(tableCont).appendTo('table#songList');