2011-12-11 110 views
2

我想加載jQuery JS異步然後我想調用一些回調方法,當它完全加載。 我可能會一遍又一遍地使用相同的代碼塊。所以我想在實際添加之前檢查jQuery(或其他腳本)是否已經被添加。如果它已經被加載/加載,那麼當前調用的回調應該被附加到先前調用的回調。這就是我想要做的。檢查腳本是否已經加載。如果不是,加載它異步

/*BP Asynchronous JavaScript Loader*/ 
if (typeof bp_onload_queue == 'undefined') var bp_onload_queue = []; 

if (typeof bp_dom_loaded == 'boolean') bp_dom_loaded = false; 
else var bp_dom_loaded = false; 

if (typeof bp_async_loader != 'function') { 
    function bp_async_loader(src, callback, id) { 

     var script = document.createElement('script'); 
     script.type = "text/javascript"; 
     script.async = true; 
     script.src = src; 
     script.id = id; 
     //Check if script previously loaded. 
     var previous_script = document.getElementById(id); 
     if (previous_script) if (previous_script.readyState == "loaded" || previous_script.readyState == "complete") { 
      callback(); 
      alert("had already loaded the same script completely"); 
      return; 
     } else { 

      script = previous_script; 
     } 
     if (script.onload != null) previous_callback = script.onload; 
     script.onload = script.onreadystatechange = function() { 
      var newcallback; 
      if (previous_script && previous_callback) newcallback = function() { 
       previous_callback(); 
       callback(); 
      }; 
      else newcallback = callback; 
      if (bp_dom_loaded) { 
       newcallback(); 
      } else bp_onload_queue.push(newcallback); 
      // clean up for IE and Opera 
      script.onload = null; 
      script.onreadystatechange = null; 
     }; 
     var head = document.getElementsByTagName('head')[0]; 
     if (!previous_script) head.appendChild(script); 
     else alert("had already started loading that script but not complete.so we appended to the previous script's callback"); 

    } 
} 

if (typeof bp_domLoaded != 'function') function bp_domLoaded(callback) { 
    bp_dom_loaded = true; 
    var len = bp_onload_queue.length; 
    for (var i = 0; i < len; i++) { 
     bp_onload_queue[i](); 
    } 
} 
/*JS gets loaded here */ 

bp_domLoaded(); 

/*Loading jQuery Asynchronously */ 
bp_async_loader("http://code.jquery.com/jquery-1.4.4.js", function() { 
    alert("script has been loaded : 1"); 
}, "jQueryjs"); 

bp_async_loader("http://code.jquery.com/jquery-1.4.4.js", function() { 
    alert("script has been loaded : 2"); 
}, "jQueryjs"); 

有人可以讓我知道,如果在這段代碼中有任何錯誤,或者如果有更好的方法做到這一點?

+2

通常更好的方法是這樣做 - 增加了jQuery需要使用它的網頁,並且不要將它添加到頁面,唐「T。如果您在服務器上使用某種框架,它可能會有工具,以便我們可以聲明特定模塊假定頁面中存在某些腳本。 –

+0

感謝您的快速回復:)。此代碼適用於JavaScript插件,我將在不同的插件中重複使用相同的腳本。因此,我想消除再次加載的相同腳本。我試圖做類似於FB加載JavaScript SDK的操作。 – coderplus

+1

您可以使用谷歌加載器來加載jquery,或者至少看看他們是如何做到的。不過,我認爲你需要一個API密鑰。 –

回答