Question

我对Javascript有点新手，特别是Ajax，我希望有人可以帮助我完成我正在进行的宠物项目的最后一次驼峰。

我有一个Ruby on Rails应用程序，它使用Bootstrap API，用于显示网页上几个正在运行的线程的状态。每个线程都由一个ActiveRecord对象表示，该对象包含一个progress属性，旨在由我的控制器在线程进程中的某些里程碑进行更新。

应用程序的所有方面都正常工作，但我需要进度条动态更新，因为每个活动线程的progress属性都会发生变化。我已经尝试了javascript的setInterval方法，但奇怪的是，它似乎只在页面加载后触发一次，而不是像我指定的那样每一秒。我读了一些关于ajax的内容，我想我理解它应该如何工作，但是我对如何使它适应我的特定应用程序有所了解。以下是我的.html.erb文件中包含进度条的<div>：

<% @all_active_threads.each do | active_thread | %>
    <div class="row">
        <div class="progress progress-striped active span6">
            <div id="progressbar<%= active_thread.thread_id %>" class="bar" style="width: <%= active_thread.progress %>%;"><%= active_thread.campaign %></div>
        </div>
    </div>
<% end %>

我见过的大多数ajax示例都谈到将检索到的数据集附加到页面，或修改div以包含它。在我的例子中，我在我的控制器中有一个动作，它从数据库中检索所有活动线程的数组，将其转换为JSON对象，并将其呈现为json，我的javascript代码正确检索此数组。我只需要更新每个条的“width”属性以等于这个新的progress值。出于说明目的，这是两个活动线程的检索数组的外观：

[ { id: 1, thread_id: 42, progress: 33 }, { id: 2, thread_id: 11, progress: 86 } ]

我的问题是，如果我编写了javascript代码来检索数组，获取进度值，并将其分配给进度条，我如何编写ajax函数来每秒执行此操作？

非常感谢你的帮助！

Answer 1

JavaScript setInterval方法可让您在循环中执行方法。例如：

setInterval(function(){
  updateProgressBar();
},1000);

每秒更新Bootstrap进度条？

1 个答案: