延遲功能，直到$變爲可用

由於性能原因，雅虎建議到load scripts at the bottom of an HTML pages。我使用HTML5 Boilerplate，它遵守規則。

這種方法的問題是，jQuery也加載在底部。如果由於某種原因，我需要編寫內聯JavaScript包含jQuery代碼我不能，因爲$尚未在名稱空間中可用。

出現這種情況，例如與galleria.js（jQuery的圖片庫引擎），這需要這個標記：

<div id="gallery"> 
    <img src="/media/img1.png" /> 
    <img src="/media/img2.png" /> 
</div> 

<script> 
$('#gallery').css('height', '200px'); // this is required for galleria to work 
Galleria.run('#gallery'); 
</script>

代碼設置的#gallery高度因爲jQuery被加載後不工作。 Firebug的控制檯提供了：

ReferenceError: $ is not defined

任何提示posticipate <script>塊，直到$符號執行可以在命名空間中找到？

來源

2012-07-31 Paolo

在頂部或中間等待底部加載的內容腳本沒有意義 - 將內聯腳本移動到您在其中包含jQuery的位置之下。如果我可以大致概括一下，除非它做了一些不能等待頁面加載的內容（例如，'document.write（）'），否則不應該在頁面中間需要內聯腳本。 – nnnnnn 2012-07-31 01:51:29

你可以將你的腳本封裝在函數中，並在jQuery加載後運行的腳本中調用它們。

來源

2012-07-31 01:36:22 secretformula

如果可以，只需將jQuery放置在HEAD中即可。這是可以接受的，因爲它是一個非常常見的庫。然而，除了明顯地移動腳本塊以滿足jquery腳本的要求之外，你幾乎只有一個選擇 - 使用window.setTimeout（function（）{... jQuery code ...}，2000）; ......在我看來，上述是一種創可貼......不是最佳做法。

請注意：這是完全不可靠的，因爲我們「猜測」用戶將在兩秒內加載jQuery ......當然，您可以延長超時時間。但是，從速度（/年齡）和用戶帶寬的一切都會影響時間。這是不可預測的。

來源

2012-07-31 01:39:15

我只是不會在第一時間使用setTimeout。我不會依賴那些「完全不可靠」的東西。 – 2012-07-31 01:42:44

同意...但是，有時您沒有選擇（如果您無權編輯整個代碼庫，尤其是在大型開發環境中）。同樣，它的意思是作爲一種創可貼......並且是最後的手段。 – 2012-07-31 18:37:59

將您的jQuery <script>標籤留在底部，然後將Galleria <script>移動到下方。

<script type="text/javascript" src="jquery.js"></script> 
<script> 
$('#gallery').css('height', '200px'); // this is required for galleria to work 
Galleria.run('#gallery'); 
</script>

來源

2012-07-31 01:40:07

您可以創建自己的「準備檢查器」。

<script> 
    var id = window.setInterval(function(){ 

     if(document.readyState != 'complete') return; 

     //onload code here 

     window.clearInterval(id); 
    }, 10); 
</script>

這樣，您可以等待文檔準備就緒，並且即使它在文檔的底部也會加載jQuery。

來源

2012-07-31 01:49:18 ExceptionLimeCat

將「code here」代碼放入函數並從底部定義的jQuery'$（document）.ready（）'處理函數調用該函數不是更容易嗎？ – nnnnnn 2012-07-31 01:52:50

難道不會拋出「非法令牌$'？如果jQuery尚未加載 – ExceptionLimeCat 2012-07-31 01:55:46

哦，我明白了。在下面或者在同一個腳本標記中有你的jQuery引用。是的，這可能會更容易。 – ExceptionLimeCat 2012-07-31 01:57:38

延遲功能，直到$變爲可用

回答

相關問題