2012-01-10 330 views
3

我正在製作一對小部件,這些小部件可以單獨包含或作爲一對包含在內,並且沒有特別的順序。我確保jQuery是加載通過使用這個腳本:檢查是否包含jQuery

if (typeof jQuery == 'undefined') { 
    //alert("about to load jquery"); 

    var esm_script_tag = document.createElement('script'); 
    esm_script_tag.setAttribute("type","text/javascript"); 
    esm_script_tag.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js") 
    esm_script_tag.onload = main; // Run main() once jQuery has loaded 

    esm_script_tag.onreadystatechange = function() { // Same thing but for IE 
     if (this.readyState == 'complete' || this.readyState == 'loaded') main(); 
    } 

    document.getElementsByTagName("head")[0].appendChild(es_script_tag); 

} 
else{ 

    main(); 
} 

在一個腳本,它觸發功能main()和其他main2()。問題是,一旦第一個腳本運行,它開始包括jQuery。當第二個運行時,jQuery尚未加載,但不會再加載它以啓動功能main2()

有沒有更好的方法來包含jQuery?有沒有辦法讓我的小部件檢查jQuery是否處於被加載的狀態並保持到它準備好?

感謝您的回覆。

+0

如果你在文檔準備好了這個測試呢? – DOK 2012-01-10 21:11:11

+0

@DOK這不是多餘的嗎? – Blazemonger 2012-01-10 21:14:25

+0

但是$(document).ready在jQuery加載之前不可用。 – emachine 2012-01-10 21:14:29

回答

1

當然,首先您應該考慮使用第三方庫進行依賴關係管理。然而,當你想將原始代碼包含到每個小部件時,可能會出現這種情況,因此它可以在沒有任何其他預先請求的引用的情況下生存。

上的jsfiddle我創造了什麼你試圖去撫仿真:http://jsfiddle.net/ayezutov/dvvKE/16/

下面的代碼使用超時效仿腳本加載延遲:

setTimeout(function() { 
     document.getElementsByTagName("head")[0].appendChild(esm_script_tag); 
    }, Math.floor(Math.random(500))); 

在量產版,這應該是肯定的寫在你的代碼中。

因此,經過一些重構,加載代碼被移動到一個函數:http://jsfiddle.net/ayezutov/dvvKE/20/。這個問題仍然存在,你可以注意到:

加載的jQuery從腳本1:從腳本2
加載的jQuery:
執行主腳本1:1.5.1
執行主腳本2:1.5.2

下一步是創建一個自定義隊列,這會排隊的所有加載請求,裏面傳來了jQuery加載開始後:

if (!window.__jQueryLoadedQueue) 
     window.__jQueryLoadedQueue = [loadCompleted]; 
    else 
    { 
     window.__jQueryLoadedQueue.push(loadCompleted); 
    } 

    var completeFunction = function(){ 
     for(var i = 0; i < window.__jQueryLoadedQueue.length; i++){ 
      window.__jQueryLoadedQueue[i](); 
     } 
     delete window.__jQueryLoadedQueue; 
    } 

正如你所看到的(http://jsfiddle.net/ayezutov/dvvKE/23/)現在腳本開始只加載一次,而complete函數被調用。

+0

一個更文明的年齡的優雅的答案。 - 感謝您花時間做到這一點。 – emachine 2012-01-11 16:07:00