Question

使用Rails 3.2。这是我编码的一个简单的Ajax加载：

# places/revisions.html.erb
<a href="<%= version_path(version) %>" class="diff">View changes</a>

<div id="version"><!-- #version used for ajax -->
  Click "View changes" to see the diff.
</div>

<% content_for :javascript_onload do %>
  $('a.diff').attr('data-remote', 'true');
<% end %>

# versions_controller.rb
class VersionsController < ApplicationController
  def show
    @version = Version.find(params[:id])
  end
end

# versions/show.js.erb
$('#version').html('<%= escape_javascript render :partial => "versions/version", :locals => {:version => @version} %>');

<div id="version"></div>将被替换为通过Ajax获取的新内容。当它仍在加载时，我想在View changes的{{1}}旁边添加一个图片加载器。我该怎么做？

Answer 1

我假设您使用jQuery触发它。

在您的视图中，除了“查看更改”之外，您还可以放置包含图像的div。

<div id="version"><!-- #version used for ajax -->
  Click "View changes" to see the diff. 
  <div class="image"></div><!-- it should be hidden first. -->
</div>

<a href="#" class="diff">View Changes</a>

并为您的AJAX触发器提供两个事件。

$('a.diff').click(function(){
   $.ajax({url: 'your url', 
        data: 'your params', 
        beforeSend: function() {
           $('div.image').show();
        }, 
        complete: function() {
           $('div.image').hide();
        }});

});

在Rails中显示ajax加载程序图像

1 个答案: