jQuery - 轮询作业队列

Question

我有一个包含作业队列的数据库表。一个单独的程序处理这些作业。我想提供一个网页供用户观看队列的进度。用于查询表并以 JSON 格式返回的服务器端脚本没有问题。

我读过一些关于 jQuery 和 PeriodicalUpdater 插件 的文章。我想知道是否有可能使用这个插件来创建一个可视队列（基本解释是一个单列表，队列中每个条目一行），其中已完成的作业将在下一个队列中删除投票时间。正如我所说，服务器端脚本不是问题，我只是无法理解这种 UI/动画。任何进一步阅读的提示将不胜感激，或者如果我完全找错了树，也请告诉我。

提前致谢

Answer 1

我不熟悉 periodicalupdater 插件，但如果我是你，我会考虑简单地使用 JavaScript 的“setTimeout”函数。 setTimeout 允许您以指定的时间间隔运行函数。

有关与您的情况相关的示例，请参见此处：

<script type="text/javascript">

setTimeout("updateTable();", 5000);

function updateTable()
{
     $.post("/your_script.php", {}, function(result) {

          $("#my_table").html(result);

     });
     setTimeout("updateTable", 5000);
}

</script>

注意：一秒有 1000 毫秒，因此该函数设计为每 5 秒触发一次。

另外...

我假设队列表中的每个条目都有一个与其关联的唯一 ID。在您的 HTML 主页面中，我将打印出如下所示的表格：

<table>
<tr id='q1'><td>Queue Item 1</td></tr>
<tr id='q2'><td>Queue Item 2</td></tr>
<tr id='q3'><td>Queue Item 3</td></tr>
<tr id='q4'><td>Queue Item 4</td></tr>
<tr id='q5'><td>Queue Item 5</td></tr>
</table>

换句话说，为队列表中的每一行分配与表中条目相同的 ID。然后，当您的 AJAX 调用返回结果时，您可以检查是否有任何队列项目已完成。如果有，您可以执行以下操作：

$("#q1").fadeOut("fast");

Answer 2

您不需要长时间轮询。您只需要定期使用 ajax 调用来使用 setInterval 刷新队列。每次调用服务器时，您都会获取整个现有队列，与当前队列进行比较，并删除不再存在的队列：

<script type="text/javascript">
var old_result = {};
setInterval(function(){
     $.post(YOUR_URL, {}, function(result) {
       //compare result with old_result
       //remove missing elements using an animation on that row
       //set old_result to result
     });
}), 5000);

</script>