Rails - 在AJAX請求正在執行時顯示加載器

Question

我有一個表單，當通過AJAX發送這個表單時，我顯示ajax-loader圖像，然後當請求完成時，在2秒內我想隱藏這個裝載機。不幸的是，在實踐中，ajax-loader總是隻顯示0.5s（僅僅是我的估計）。 奇怪的是，CSS類transparent在2秒內隱藏，但圖像加載器不是。

忽視我重要的東西？爲什麼圖像加載器在2秒內沒有隱藏，但已經在0.5秒內？

update_page.html.haml

%h1 Update 
= render :partial => 'update_it' 

_update_it.html.haml

%section#update_it 
    = form_for(@user, :remote => true, :html => {:class => 'form-horizontal'}) do |f| 
    ... 
    = submit_tag 'Save changes', :id => 'update_information' 

update.js.haml

$('#update_it').html("#{escape_javascript(render(:partial => 'update_it'))}"); 
setTimeout(function() { 
    $('section#update_it').removeClass('transparent') 
} , 2000); 

周的script.js

$(document).ready(function(){ 
    $("#update_information").click(function(){ 
    $('section#update_it').addClass('transparent'); 
    $('.transparent').append('<img src="/assets/ajax-loader.gif" alt="" id="loader" class="loader" />'); 
    }); 
}); 

編輯我忘了一兩件事，但 - 當我點擊第一次提交按鈕，則使用CSS類transparent，但是當我按一下按鈕第二次，那麼已經不是。爲什麼？有什麼問題？

Answer 1

對不起，我的直截了當，但我認爲你正在使簡單的事情變得複雜。

嘗試使用jQuery的ajax回調函數（如ajaxStart（））重新實現「ajax loader」。 （請參閱：http://api.jquery.com/ajaxStart/）

並且一旦ajax完成，請使用另一個回調函數，如「success」或「complete」來替換ajax-loader。 （見http://api.jquery.com/jQuery.ajax/）