Question

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

我已经对jQuery和PeriodicalUpdater plugin做了一些阅读。我想知道是否可以使用这个插件来创建一个可视队列（一个基本的解释是一个列表，队列中每个条目有一行），其中已经完成的作业将被删除民意调查时间。正如我所说，服务器端脚本不是问题，我只是无法理解这种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

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

<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>

jQuery - 轮询作业队列

2 个答案: