2011-03-18 80 views
5

我有一個延遲加載JavaScript文件,當文件中的類準備好使用時,如何捕獲事件?我只需要在特定情況下加載此腳本。因此它不是通過onload加載的,而是在if子句中加載的。JavaScript如何在延遲加載的腳本準備就緒時捕獲事件?

延遲加載代碼,我從這裏拿了:http://friendlybit.com/js/lazy-loading-asyncronous-javascript/

if (externalClassRequired) { 
    var s = document.createElement('script'); 
    s.type = 'text/javascript'; 
    s.async = true; 
    s.src = 'http://yourdomain.com/script.js'; 
    var x = document.getElementsByTagName('script')[0] 
    x.parentNode.insertBefore(s, x); 

    // When do I know when the class named "geo" is available? 
} 

更新:
對不起球員,我完全忘了Ajax的! :)我非常關注我的問題,我沒有看到@Tokimon的明顯解決方案。通過jQuery最簡單的解決方案將是:

$.getScript('http://yourdomain.com/script.js', function() { 
    // callback or use the class directly 
}); 

回答

1

或者你可以通過AJAX拿到劇本。然後你確定當ajax成功事件被觸發時腳本被加載:)

+0

忘記了Ajax!謝謝! – powtac 2011-03-19 14:05:12

1

因爲它需要一個HTTP請求,你應該可以把一個onload事件。

s.onload = function() { 
    // do something 
} 

在「更快網站」史蒂夫Souders的提供了一個解決方案,由此可以看出here

1
var onloadCallback = function() { 
    alert('onload'); 
} 

var s = document.createElement('script'); 
s.type = 'text/javascript'; 
s.async = true; 
s.onreadystatechange = function() { // for IE 
    if (this.readyState == 'complete') onloadCallback(); 
}; 
s.onload = onloadCallback; // for other browsers 
s.src = 'http://yourdomain.com/script.js'; 
var x = document.getElementsByTagName('script')[0] 
x.parentNode.insertBefore(s, x); 

你也可以使用XMLHttpRequest來加載文件。

+1

Opera將觸發兩次回調。 – jasssonpet 2011-03-18 16:25:43

3
if (s.readyState) s.onreadystatechange = function() { 
    if (s.readyState === "loaded" || s.readyState === "complete") { 
     s.onreadystatechange = null; 
     callback(); 
    } 
}; else s.onload = function() { 
    callback(); 
}; 
+0

好吧,這意味着「加載」(HTTP = 200)文件中的類已準備好使用? – powtac 2011-03-19 13:57:20

+0

@powtac是的,它意味着下載和解析。分號是有原因的。 – jasssonpet 2011-03-20 13:47:11

相關問題