0

我在页面中有以下脚本show.html.erb，以更新我的进度条。但是它使用 jQuery，并且由于 jQuery 只是在我的布局末尾加载application.html.erb，我不能在我的页面上使用它。所以我show.html.erb在脚本代码之前的页面上也需要它。

很明显，这不是正确的做法。我应该把我的脚本代码放在哪里，以便为这个页面加载它？另一个问题是它使用来自控制器的信息 ( @batch)。如果我将它移动到我的资产文件夹中的 js 文件中，我该如何访问它？

下面的代码放在最后show.html.erb

<%= javascript_include_tag "application" %>

<script type="text/javascript">
function progress(){
    var progress = setInterval(function() {
      var $bar = $('.bar');
      var $pct = $('#pct');
      $.get("<%= @batch.id %>/status.json", function(data){
        if (data.status == "done") {
          location.reload();
        } else {
          $bar.width(data.progress+"%");
          $pct.text(data.progress+"%");
        }
      });
    }, 800);
}

$(document).ready(function() {
  $.get("<%= @batch.id %>/status.json", function(data) {
    if (data.status == "processing") {
      progress();
    }
  });
});
</script>

编辑

由于现在我得到了 batch_id，我可以检查它是否存在来运行代码：

$(document).ready(function() {
  var batch_id = $("#batch").data("batch-id");
  if (batch_id != null) {
    $.get(batch_id + "/status.json", function(data) {
      if (data.status == "processing") {
        progress();
      }
    });
  }
});
4

1 回答 1

1

处理此问题的方法是通过不显眼的 javascript（将您的 javascript 与 html 分开）。

首先，移动文件部分中的<%= javascript_include_tag "application" %>，以便在每个页面上正确加载 jquery。<head>application.html.erb

然后，将脚本移动到资产目录中的 js 文件中。

要访问，请在视图文件 ( )@batch.id中的数据属性中添加此 id 。show.html.erb

<div id="etc" data-batch-id="<%= @batch.id %>"></div>

然后，在您的脚本中：

var batch_id = $("#etc").data("batch-id")
$.get(batch_id + "/status.json", ...
于 2013-04-12T14:30:03.423 回答