2

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

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

提前致谢

4

2 回答 2

8

我不熟悉 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");
于 2010-02-02T18:54:51.307 回答
0

您不需要长时间轮询。您只需要定期调用 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>
于 2010-02-02T19:22:31.397 回答