Nice IE!Nice Firefox!
Nice IE
最近在寫一些會用到 AJAX 的網頁,目前使用的 JavaScript framework 是 jQuery,於是乎,會有類似這樣(方便舉例而寫)的 code:
<a href="#" onclick="$('#content').load('/url/for/XXX');">Load XXX</a> <div id="content"></div>
而 /url/for/XXX 這個頁面有引入一個 XXX.js 檔案,為了在 /usr/for/XXX 全部讀進 div#content 後作一些 event handling 的 initialization,所以我在 XXX.js 裡有這麼一段:
function XXX_init(e) { // 作一些 initializations.. } $('#content').ready(XXX_init);
由於我一直是開著 Firefox/Navigator + firebug 在寫網頁,這樣的寫法一直可以成功運作,直到我拿出 IE 之後,發現 XXX_init 雖然被呼叫了,但是在 /url/for/XXX 裡的物件都沒有被處理過…,這時我就猜想,是不是 ready 被 trigger 的時間在 IE/Firefox 是不同的..
所以我就把處理 div#content ready 的部份改寫成:
$('#content').ready(function(e){ setTimeout(XXX_init, 100); });
這樣一改果然就 OK 了,這真是很微妙的時間差啊….本來很想說:「Nice IE!」的,不過我又發現另一件事,不能厚此薄彼,所以我又說了:「Nice Firefox!」
Nice Firefox
這個狀況是發生在我使用了 window.open 的禁斷技 XD,簡單地說我開了一個 popup window 作了一些事,作完之後會使用 AJAX 在原來頁面中 load 一些東西。以下是 popup window 的情境(為了說明而寫) code :
<input type="button" value="結束" onclick="window.opener.doLoad();window.close();" />
這是叫原視窗去執行原視窗中的 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
感謝您的回應,受教了 :)