Executing jQuery code after loading jQuery via javascript
我想从Google的cdn中加载jquery,如果请求成功,就执行jquery代码,但我似乎无法让它正常工作。以下是我的代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function loadjQuery(success, error) { var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp'); xhr.onload = function() { success(xhr.status, xhr.readyState); } xhr.onerror = function() { error(); } xhr.open("GET","https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js", true); xhr.send(); } loadjQuery( function(status, state) { console.log(status) // 200 console.log(state) // 4 console.log($('body')) // Uncaught ReferenceError: $ is not defined }, function() { setTimeout(loadjQuery, 10000); } ); |
任何帮助都会非常感谢
使用以下代码加载jquery
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | (function () { function loadScript(url, callback) { var script = document.createElement("script") script.type ="text/javascript"; if (script.readyState) { //IE script.onreadystatechange = function () { if (script.readyState =="loaded" || script.readyState =="complete") { script.onreadystatechange = null; callback(); } }; } else { //Others script.onload = function () { callback(); }; } script.src = url; document.getElementsByTagName("head")[0].appendChild(script); } loadScript("https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js", function () { //jQuery loaded console.log('jquery loaded'); console.log($('body') //works }); })(); |
考虑使用像RequireJS(http://requireJS.org/)这样的东西。你需要一个模块化的系统来获取你的谷歌源代码并加载它,这样它才是可用的。然后,您将能够在加载模块之后执行操作。像你已经开始做的那样,你自己建立这个系统可能需要很多工作。
有关AMD和RequireJ的更多信息,请参阅此问题的答案:动态加载的javascript库何时可用?