javascript - Rails 3.2 在开发模式下的请求处理顺序

Question

我有一个页面在异步加载动态内容时显示微调器动画（此处为 HAML）：

#loading_spinner

#async_vote

:javascript    
  $(document).ready(function() {
    $.ajax({
      url: "/votes/voteables",
      cache: false,
      beforeSend: function(xhr){
        $("#loading_spinner").show();
      },
      success: function(html){
        $("#loading_spinner").hide();
        $("#async_vote").html(html);
      }
    });
  });

为了模拟一个缓慢的请求，我在 - 方法中设置了几秒钟的睡眠时间:voteables。

现在，问题是浏览器没有显示-elementbackground-image的。#loading_spinner

发生的情况是，虽然 JavaScript 代码应该在页面加载时执行，但它实际上是在获取微调器的背景图像之前执行 AJAX 调用。因此当控制器中的延迟为 3 秒时，图像会立即加载（因为请求不是并行服务的），success执行 -callback 并立即隐藏图像。

我正在使用 Rails 3.2 并使用rails server.

任何建议如何在开发中解决此问题？这会成为生产中的问题吗？

Answer 1

我认为，如果您将 ajax 请求包装在加载中，而不是准备就绪，它将在图像下载之前不会执行，如下所示：

$(window).load(function(){
  // ajax functionality goes here
});