動態加載腳本

爲了響應Ajax請求，我在代碼中動態加載了幾個YUI腳本。 DOM和頁面在請求完成時被完全加載 - 這是用戶事件的響應。動態加載腳本

我把標籤添加到頭像兒童一樣。但我偶然發現了一些問題：

我添加了兩個YUI腳本， CDN和我自己負責創建對象，添加事件偵聽器和呈現YUI小部件的內聯腳本。但我當我的腳本運行YUI腳本沒有加載，但給我錯誤，並沒有按照我的預期運行。

當YUI腳本完全加載時，有一種方法可以運行我的腳本（或定義一個要運行的函數）？

來源

2010-06-26 Vitor Py

你可以使用一個setTimeout()運行一些功能，如果它的加載，只是檢查 - 檢查像

if (typeof YUI_NAMESPACED_THING !== "undefined") runCode()

編輯感謝，CMS

來源

2010-06-27 00:04:08

的'typeof'符*總是*返回一個字符串，檢查應該是'如果（typeof運算YUI_NAMESPACED_THING！= 「未定義」）// ...' – CMS 2010-06-27 00:51:44

這是錯誤的方式去了解它。首先，你可能想到了setInterval或一個setTimeout，因爲一個setTimeout可能會導致執行時間過長，導致頁面建立時間不必要，或者B）通過假設腳本被加載到一定的時間。基於onload/onreadystatechange解決方案的東西更好。 – Luke 2010-06-27 06:35:48

@Luke我正在考慮鏈式setTimeout。但是，是的，我同意onload/onreadystatechange是更好的解決方案。我知道onload本身並不起作用，並不知道在那條巷子裏有一個跨瀏覽器解決方案。我upvoted digitalFresh的答案 – 2010-06-27 06:38:58

你試過onload事件？

編輯：（感謝傑米）

var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.src = src; 
//IE: 
if(window.attachEvent && document.all) { 
    script.onreadystatechange = function() { 
     if(this.readyState === "complete") { 
      callback_function(); //execute 
     } 
    }; 
} 
//other browsers: 
else { 
    script.onload = callback_function; //execute 
} 
document.getElementsByTagName("head")[0].appendChild(script);

來源

2010-06-27 00:06:25 tcooc

雖然這可能實際上在一些瀏覽器工作，'腳本'元素不需要有一個onLoad事件處理程序，據我所知 - http://www.w3schools.com/tags/tag_script.asp – 2010-06-27 01:22:55

除IE以外的所有瀏覽器都有一個'onload'事件（有點可預測）。在IE中，你需要一個備用'onreadystatechange'函數。 – tcooc 2010-06-27 02:15:52

+1 - 沒有聽說過'onreadystatechange'。很高興知道 – 2010-06-27 04:26:39

如果你使用YUI 2.x的我強烈建議使用YUI Get實用，因爲它是專門用來處理只是這類的問題。

來源

2010-06-27 06:14:00 Tivac

如果您正在從Yahoo!加載多個單獨的腳本文件， CDN，您需要確保在執行您的相關代碼之前加載了這兩個文件。您可以使用組合處理程序來避免這種情況。請參閱配置器以獲取腳本url應該從一個url加載/所有需要的YUI文件。

http://developer.yahoo.com/yui/articles/hosting/

考慮到這一點，假設你必須異步加載YUI的文件，如digitalFresh注意到你應該使用一個onload/onreadystatechange的處理程序。

我不過推薦以下模式，：

(function (d) { 
    var s = d.createElement('script'), 
     onEvent = ('onreadystatechange' in s) ? 'onreadystatechange' : 'onload'; 

    s[onEvent] = function() { 
     if (("loaded,complete").indexOf(this.readyState || "loaded") > -1) { 
      s[onEvent] = null; 

      // Call your code here 
      YAHOO.util.Dom.get('x').innerHTML = "Loaded"; 
     } 
    }; 

    // Set the src to the combo script url, e.g. 
    s.src = "http://yui.yahooapis.com/combo?2.8.1/..."; 

    d.getElementsByTagName('head')[0].appendChild(s); 
})(document);

來源

2010-06-27 06:59:42 Luke

如果我理解這個正確的，這個您的Ajax響應：

<script href="yui-combo?1"></script> 
<script href="yui-combo?2"></script> 
<p>some text here</a> 
<script> 
// using some of the components included in the previous combos 
// YAHOO.whatever here... 
</script>

如果是這種情況，這是一個明確的情況下，你應該在其中使用調度器插件。分派器將模擬AJAX響應的瀏覽器加載過程。基本上它會按照正確的順序加載和執行每個腳本。

最好的問候， Caridy

來源

2010-06-27 15:06:39

動態加載腳本

回答

相關問題