html5boiler板+ jquery移動=腳本加載兩次

我正在使用html5 boilerplate作爲html等的基礎的實驗jQuery手機應用程序。html5boiler板+ jquery移動=腳本加載兩次

基本上所有我就此做了多遠：

下載和提取HTML5樣板，並查看它在瀏覽器中。確保腳本/樣式正確加載。準備好了。
添加jQuery Mobile的（CDN託管完整版1.0 [今日發佈？對上！]）
添加$(document).ready(function() { console.log('ready'); });
刷新。 '準備好'是輸出兩次..第二個稍微延遲..
wtf bbq和鉻檢查器中的這種檢查情況..注意所有JavaScript文件似乎被加載兩次。
重新從頭開始，在瀏覽器中提取h5bp加載，特別注意腳本加載一次。添加文檔準備處理程序，觀察「準備就緒」的輸出。
添加jquery mobile觀察腳本加載一次。
將所有腳本移動到標記中。腳本加載一次。

任何人有任何想法是怎麼回事？應該很容易重現這一點，只需提取h5bp並將jquery mobile添加到底部的腳本部分，並突然腳本全部加載兩次。將所有這些腳本移動到現代化之前（或之前）的頭標籤中，這不再發生。

謝謝

來源

2011-11-18 alex.pilon

不知道但我只是開始刪除代碼。 JQM，JQ和Modernizr不同意這可能是一些假冒僞裝手段。只是減少你的測試用例越來越多，直到你發現衝突 –

有趣的，我會看看假身體。 –

Modernizr使用YepNope加載腳本。如果你看看這裏的問題：https://github.com/SlexAxton/yepnope.js/issues/10

你會看到腳本加載故意兩次：

Yepnope不要求每一個文件，你把它的兩倍。第一次將自身加載到緩存中，作爲某種非可執行實體（對象元素，img元素或帶有假類型屬性的腳本元素，取決於您的瀏覽器）。第二次注入的是，我們將其注入爲可執行腳本，並且這次它緩存了。因此，執行回調函數並重新注入一個腳本標記（，無論訪問緩存需要多長時間），只需要毫秒或更少的時間即可執行回調函數。

在http://yepnopejs.com主頁上還提到了這一點。只要去那裏，向下滾動到I'm seeing two requests in my dev tools, why is it loading everything twice?

來源

2011-11-21 19:16:01 swatkins

我想你需要仔細閱讀我的文章。我知道yepnope的行爲，問題是，添加了jquerymobile，事件處理程序等實際上執行兩次。根據檢查員的網絡面板WITH jqM，腳本也會被加載兩次，但不是沒有。 –

夠公平的。但是，如果您閱讀我介紹過的yepnope頁面上的段落，則表示如果您看到雙倍加載時間，則需要確保發送正確的緩存標頭。如果yepnope無法緩存第一個負載，那麼你會得到雙重執行。 – swatkins

只是重新閱讀舊評論 - 不打算以聽起來的方式脫穎而出。遲來的感謝信息。 –

我試圖在基本的html頁面上添加jQuery和jQuery Mobile，它似乎也是這樣發生的。所以不要認爲它與h5bp相關。你可以試試剝離h5bp的東西，並再次加載？

來源

2011-11-21 19:25:50

有趣的是，我會嘗試只添加jQuery和jqM到一個簡單的html5頁面。 –

你使用$（document）.ready（）嗎？

跑到這個相同的問題，並沮喪到最後，注意到如果我把所有的JS移動到文檔的頭部它工作得很好。當我切換所有內容時，pageinit開始在JS所屬的頁面底部開始正常工作。

例如：

<div id="mainPage" data-role="page"> 
    <script type="text/javascript"> 
     $("#project_map_page").live('pageinit', function() { 
     // INSERT JS HERE 
     }); 
    </script> 
</div>

進一步詳情，請訪問：http://jquerymobile.com/demos/1.0/docs/api/events.html

來源

2012-01-24 20:21:01 Alvin

這並沒有幫助我:( – Vikram

可能已經改變 - 這個答案已經超過2歲=） – Alvin

哦太糟糕我嘗試了幾乎所有的可能性仍然無法弄清楚 – Vikram

確保你的根格是這樣的...

<body> 
<div data-role="page"> 
<!-- Content --> 
</div> 
</body>

來源

2012-05-10 14:39:43 JGilmartin

把<script>document.ready()</script>在<head></head>將解決這個問題。

來源

2012-10-20 15:32:52 gfreezy

html5boiler板+ jquery移動=腳本加載兩次

回答

相關問題