Nice IE!Nice Firefox!
Nice IE
最近在寫一些會用到 AJAX 的網頁,目前使用的 JavaScript framework 是 jQuery,於是乎,會有類似這樣(方便舉例而寫)的 code:
[code lang=”xml”]
Load XXX
[/code]
而 /url/for/XXX
這個頁面有引入一個 XXX.js
檔案,為了在 /usr/for/XXX
全部讀進 div#content
後作一些 event handling 的 initialization,所以我在 XXX.js
裡有這麼一段:
[code lang=”javascript”]
function XXX_init(e) {
// 作一些 initializations..
}
$(‘#content’).ready(XXX_init);
[/code]
由於我一直是開著 Firefox/Navigator + firebug 在寫網頁,這樣的寫法一直可以成功運作,直到我拿出 IE 之後,發現 XXX_init
雖然被呼叫了,但是在 /url/for/XXX
裡的物件都沒有被處理過…,這時我就猜想,是不是 ready
被 trigger 的時間在 IE/Firefox 是不同的..
所以我就把處理 div#content
ready 的部份改寫成:
[code lang=”javascript”]
$(‘#content’).ready(function(e){
setTimeout(XXX_init, 100);
});
[/code]
這樣一改果然就 OK 了,這真是很微妙的時間差啊….本來很想說:「Nice IE!」的,不過我又發現另一件事,不能厚此薄彼,所以我又說了:「Nice Firefox!」
Nice Firefox
這個狀況是發生在我使用了 window.open
的禁斷技 XD,簡單地說我開了一個 popup window 作了一些事,作完之後會使用 AJAX 在原來頁面中 load 一些東西。以下是 popup window 的情境(為了說明而寫) code :
[code lang=”xml”]
[/code]
這是叫原視窗去執行原視窗中的 doLoad
然後再把自己關掉,doLoad
也是利用 AJAX 去 load 一些東西到我某個 div 裡,這回就有趣了:在 IE 裡正常,在 Firefox 會看到 firebug 抱怨 AJAX fail…。所以我再度祭出 setTimeout
來用,果然又是個沒問題了…
微妙..*推眼鏡*
用 setTimeout(XXX_init, 0); 應該也是可以的
似乎跟時間沒有很大的關係
[quote comment=””]用 setTimeout(XXX_init, 0); 應該也是可以的
似乎跟時間沒有很大的關係[/quote]
大驚…原來還有這種密技 XD
事實上應該不是時間差的問題,而是 javascript call stack 。
像我們也遇過動態把值塞入下拉選單後,卻沒辦法直接再動態跳到想預設選取的值,這時候 setTimeout(…, 0) 就會派上用場了。
詳細資訊可參考:
http://blog.thinkature.com/index.php/2006/11/26/escaping-the-javascript-call-stack-with-settimeout/
@jaceju
感謝您的回應,受教了 🙂