2011-09-28 104 views
2

我想給用戶知道,而我所做的與jQuery的AJAX調用有事情發生紡紗GIF圖像。我必須使用async:false,否則代碼會變得混亂,最終會導致一個不好的會話變量。這裏是我有什麼(即不顯示GIF,直到電話後凍結了屏幕。)jQuery的加載圖像,而異步假

$('#status' + itemNum).html("<img width='14px' src='/style/images/spinner.gif'>"); 
if (foo == "bar") { 
$.ajax({ 
    type:"POST", 
    url: "foobar.html", 
    async:false, 
    data: "val1=" + escape(newValue) + "&val2=" + fieldName + "&val3=" + newValue2 
    }) 
} else { 
$.ajax({ 
    type:"POST", 
    url: "foobar.html", 
    data: "val1=" + escape(newValue) + "&val2=" + fieldName + "&val3=" + newValue3 
    }) 
    document.getElementById('status' + itemNum).innerHTML = "SAVED"; 
} 
$("#status" + itemNum).show(); 
setTimeout("fade_out('"+itemNum+"')", 1000); 
} 

在這種情況下,我只希望異步時富=酒吧。任何人都可以讓我知道爲什麼spinner.gif在調用之後加載。我在想這可能是因爲微調不在其他地方,並且在加載時會有延遲,但是當它被多次調用時應該不會顯示出來(應該在緩存中),所以我很難過。

謝謝!

+0

歡迎SJAX的邪惡,痛苦的世界。 – SLaks

+0

另外,請勿將字符串傳遞給'setTimeout'。 – SLaks

+0

將字符串傳遞給setImeout有什麼問題? – oneadvent

回答

8

這是不可能的。
由於JavaScript中的UI線程中運行,async: false將凍結browserm包括所有的動畫。


使用async: false

你需要修正你的代碼來處理異步請求。

+0

:)我還沒找到無論如何阻止某人不斷點擊按鈕,任何建議?我想甚至在通話過程中禁用它。 – oneadvent

+2

是;禁用按鈕。 – SLaks

+0

我添加了這個答案,因爲這是我做的,禁用按鈕,並使用onsuccess重新啓用它 – oneadvent

3

async: false將鎖定瀏覽器,導致所有動畫暫停,直到處理被允許繼續。但是,通過在延遲1ms或更長的時間內將ajax調用放置在setTimeout內,您至少可以在ajax調用之前使圖形顯示出來。儘管它是一個動畫GIF,但它仍然不會動畫。


當然,上面只是一個創可貼,較好的解決辦法是不使用async: false

+0

有沒有任何選項來顯示動畫的gif,而這樣做ajax調用,並使其後消失 – oneadvent

+0

是的,如果您使用'async:true'而不是'async:false'。 –