jQuery改變圖像，而功能正在執行，以顯示進度

我知道，在一些瀏覽器（IE瀏覽器，鉻）更改爲DOM不會發生，直到函數完成後。我已經閱讀了關於如何處理這個問題的各種建議，但我沒有任何運氣。我試圖通過一系列AJAX調用進行循環，並顯示正在處理的每一行的進度。該代碼是這樣的：jQuery改變圖像，而功能正在執行，以顯示進度

for(i=0; i < rowIds.length; i++){ 

    $(rowImage).attr('src', '/images/spinner.gif'); 

     $.ajax({ 
        type: 'GET', 
        url: ajaxUrl, 
        async: false, 
        processData: true, 
        data: {}, 
        dataType: "json", 
        success: function(data) { 
         $(rowImage).attr('src', '/images/success.gif'); 
        } 
       }); 
}

我讀過有關努力，以確保圖像轉變發生在繼續之前，如AJAX調用開始之前這樣幾點建議：

var changeImage = function() { 
    $(rowImage).attr('src', '/images/spinner.gif'); 
}; 

$.when(changeImage()).done(function() { 
      //run AJAX call

但這並沒有什麼區別。直到功能完成執行後，圖像纔會更改。

您將會注意到，我將async設置爲false，並且出於各種原因正在執行此操作。但即使沒有到位，這個問題仍然存在。我也嘗試使用setTimeOut（），因爲已經建議，並且似乎不工作（並且我知道setTimeOut（）是爲異步模式，但即使在異步它似乎沒有幫助。）

來源

2014-09-26 user3521590

歡迎來到使用鎖定瀏覽器的同步Ajax調用的世界。 – epascarello 2014-09-26 18:38:50

Jquery的：

$.ajax({ 
     type: 'GET', 
     url: ajaxUrl, 
     async: false, 
     processData: true, 
     data: {}, 
     dataType: "json", 
     success: function(data) { 
      $(rowImage).attr('src', '/images/success.gif'); 
     } 
}); 

$(document).ajaxStart(function() { 
     $(rowImage).attr('src', '/images/spinner.gif'); 
    }).ajaxStop(function() { 

});

來源

2014-09-26 18:47:10

感謝您的兩個建議。不幸的是，似乎都沒有工作。 .ajaxStart只在第一次調用ajax時觸發，但不管在結束之前圖像沒有更改。我發現.ajaxSend在嘗試在每個ajax請求的開頭執行某些操作時是最好的。但是，.ajaxSend似乎可以與任何其他代碼操作一起使用，但在所有調用結束之前它不會更改任何圖像。與beforeSend相同的行爲。（在IE和Chrome中都是如此，即使使用我的原始代碼，FF也能正常工作） – user3521590 2014-09-26 20:39:43

Estimado：

Puedes intentar utilizar LAfunciónbeforeSend德ESTA MANERA：

$.ajax({ 
       type: 'GET', 
       url: ajaxUrl, 
       async: false, 
       processData: true, 
       data: {}, 
       dataType: "json", 
       beforeSend: function(data){ 
        $(rowImage).attr('src', '/images/spinner.gif'); 
       }, 
       success: function(data) { 
        $(rowImage).attr('src', '/images/success.gif'); 
       } 
      });

ESPERO TE SIRVA，saludos

來源

2014-09-26 19:58:45 Guille

歡迎使用StackOverflow！請注意，您只能在這裏使用英語進行問題和解答。你的代碼看起來不錯，順便說一句。 – VMai 2014-09-26 20:03:50

jQuery改變圖像，而功能正在執行，以顯示進度

回答

相關問題