使用JavaScript刷新“在线”用户

我有一个聊天应用程序，显示在线用户（用户名+个人资料照片）。我有一个ajax民意调查，主要检查哪些用户仍在线，并自动刷新列表。此外，该列表根据上次活动进行排序。使用JavaScript刷新“在线”用户

我一直在做它的方式是：当前在线用户的

这在Chrome中正常工作，但我注意到在Firefox中它引起“闪烁”效果，而图像被重新添加。

这样做的最好方法是什么？创建一个算法检查哪些元素存在，如果它们按照正确的顺序移动它们，似乎过于困难。想法？

2011-03-05 Andy Hin

您是否尝试过这样做，让您保留旧的DOM元素，但更新文本＆'“src”属性？然后，只需在活动计数增加时添加新的数据，并且只有在有备用数据时才删除旧数据。 – Pointy

但是，我必须创建一个算法来找出哪些需要删除，重新排序或添加。这可能很难追踪。 –

您经常轮询以查看用户是否仍在线？

我认为最好的办法可能是给用户记录唯一标识符，以便随后检查在线用户列表中是否有新的在线用户列表。

淡化已经登录的用户并淡入其中。

这将是一个更优雅的解决方案，它可以解决您遇到的问题。

2011-03-05 23:31:09

你将如何去做重新排序？（用户由lastActivity命令，即：他们最后一次发给你的信息）。然后迭代这两个列表以摆脱应该删除或添加的列表。然后再次遍历列表以更正顺序。 –

我会修改订单，因为意味着订单应该更改的操作发生。 - 我的意思是，当有人发出消息时，他们会将他们移到列表的顶部或底部（但是您可以订购用户）。这样用户应该一直处于正确的顺序。如果这没有意义，请说，我会尝试并再次解释:) –

我想我明白了，但是你能复原吗？问题是，我可用的API调用只是返回用户列表（按照正确的顺序）。所以我没有办法找出（除了比较列表）以后发生了什么变化。 –

首先，我会尝试使用“预加载”技术分别“缓存”图像。那时你创建一个Image对象并将其设置为src到userpic的URL。然后将所有这些对象存储在全局数组中。这将防止浏览器在屏幕上不再显示图像时丢失图像，以便在重新加载列表时不必再次加载它们。

如果这没有帮助，我会重新使用现有的列表元素。我只是逐个检查元素，并用列表中的适当内容替换它们的内容。如果我在流程中用完了现有的元素，我会添加新的元素。如果在列表结束时剩下任何元素，我将其删除。这有点复杂，但实际上并不像看起来那么复杂。

2011-03-05 22:41:41

我将尝试预加载/缓存图像。如果这摆脱了FF中的闪烁问题，我可能只是吻并坚持删除所有内容并阅读。 –

回答