使用JavaScript從頁腳加載JQuery

如果您想要切入點，這裏是我的問題： 有什麼辦法來調用特定的腳本來加載第一個JavaScript？使用JavaScript從頁腳加載JQuery

更多詳細信息，請閱讀以下：

我有一個從我的HTML <body>底部加載JavaScript文件。不幸的是，頭上沒有JQuery，所以我必須通過這個JavaScript文件來添加它。

我需要做的是添加一個JQuery lightbox插件。

我的問題是，當我加載頁面，有時JQuery不是加載的第一件事。所以我收到錯誤「jQuery沒有定義」。然後，這會爲插件中未定義的方法引發更多錯誤。

這不會一直髮生，只是有時候。這使我認爲這是一個加載/操作順序問題。

有沒有什麼辦法可以保證我的JQuery腳本是第一件加載的東西？

這是我的一些JavaScript文件。

//Get head element 
var head = document.getElementsByTagName("head")[0]; 

//Create and insert JQuery 
var jquery = document.createElement('script'); 
jquery.type = 'text/javascript'; 
jquery.src = 'http://image.iloqal.com/lib/fe6b/m/1/jquery.1.7.2.js'; 

head.insertBefore(jquery,head.childNodes[4]); 

function thescripts() { 

    var fancybox = document.createElement('script'); 
    fancybox.type = 'text/javascript'; 
    fancybox.src = 'http://image.iloqal.com/ilejquery.fancybox-1.3.4.pack.js'; 
    head.appendChild(fancybox); 

    var thebody = document.getElementsByTagName('body')[0]; 

    thebody.appendChild(thediv); 
    thediv.appendChild(theimg); 


    //Run fancybox 
    thebody.onload = function() { 

    $('#lightbox').ready(function() { 
     $("#lightbox").fancybox().trigger('click'); 
    }); 
} 
}; 
if(jquery.attachEvent){ 
    jquery.attachEvent("onload",thescripts()); 
} else { 
    jquery.onload = thescripts(); 
}

任何幫助表示讚賞！

來源

2012-05-14 Dandy

使用$(function() {...do your stuff here...});是要走的路是在執行腳本之前，請確保jQuery是裝的，但你很可能使它更難爲自己做：

thebody.onload = function() { 
    RunMyjQuery(); 
} 

function RunMyjQuery() { 
    if (typeof $ === 'undefined') { 
     setTimeout(RunMyjQuery, 500); 
    }else{ 
     $('#lightbox').ready(function() { 
      $("#lightbox").fancybox().trigger('click'); 
     }); 
    } 
}

來源

2012-05-14 18:54:48 adeneo

RECURSION！爲什麼我沒有想到這個？我不再收到錯誤，謝謝！雖然，這確實會給我提出一個我不熟悉的新錯誤。 ''創建'只能在擴展過程中使用'，這是onload和附加事件的問題嗎？ – Dandy

不應該是，但很難確切地說出問題是什麼，但如果它是createElement，那麼在onload處理程序中應該可以正常工作。另外，整體上應該有某種超時，所以如果jQuery出於某種原因根本不加載，間隔不會永遠持續下去，另一方面，如果需要jQuery來正確顯示網站，它並不重要！ – adeneo

你打電話thescripts立即，雖然你儘量不要。使用此：

jquery.onload = thescripts; // notice no parentheses

此外，您thebody.onload策略將無法正常工作。改爲使用$(document).ready：

$(document).ready(function{ 
    $('#lightbox').ready(function() { 
     $("#lightbox").fancybox().trigger('click'); 
    }); 
});

來源

2012-05-14 18:29:11 bfavaretto

我想現在這個樣子，我你需要重新組織一些腳本。謝謝！ – Dandy

試試這個。將這段代碼添加到您的腳本中調用的JavaScript文件中。

<script type="text/javascript"> 

if(typeof jQuery == 'undefined'){ 
     document.write('<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></'+'script>'); 
    } 

</script>

這將包括jQuery的，如果它沒有加載。我認爲這會解決你的問題。

來源

2012-05-14 18:32:52

感謝您的回覆。我以前試過這個，它不一定會修復它，但它肯定有更快的加載時間，允許jquery首先加載。我一定會保持這個實施。謝謝！ – Dandy

使用JavaScript從頁腳加載JQuery

回答

相關問題