加载jQuery，等待

Question

我需要通过JavaScript来动态加载jQuery和jQuery UI，并在加载完成后执行某些操作。

function loadjscssfile(filename, filetype){
 if (filetype=="js"){ //if filename is a external JavaScript file

  var fileref=document.createElement('script');
  fileref.setAttribute("type","text/javascript");
  fileref.setAttribute("src", filename);
 }
 else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link");
  fileref.setAttribute("rel", "stylesheet");
  fileref.setAttribute("type", "text/css");
  fileref.setAttribute("href", filename);
 }
 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref);
}


loadjscssfile("http://localhost/js/jquery-1.3.2.min.js", "js");
loadjscssfile("http://localhost/js/jquery-ui-1.7.2.custom.min.js", "js");

我做了一些调查，发现我需要使用回调或settimeout。问题是我在javascript方面非常新手，这真的给了我很大的困扰。有人可以帮助我正确地处理吗？

- Carvefx

---

动态加载 JavaScript 文件对于初学 JavaScript 的人来说是一个相当高级的主题。你为什么要动态加载这些脚本？ - Paul Turner

为什么不使用普通的<script>或<link>标签正常加载它们呢？ - Lukman

由于此 JavaScript 文件是从书签中调用的，因此它必须在站点内动态创建一个 div。 - Carvefx

Answer 1

我自己从未尝试过这样做，但可能你可以使用重复的超时来检查所需对象是否存在：

function jqueryLoaded() {
    //do stuff
}

function checkJquery() {
    if (window.jQuery && jQuery.ui) {
        jqueryLoaded();
    } else {
        window.setTimeout(checkJquery, 100);
    }
}

checkJquery();

- Tobias Cohen

---

这正是我要找的东西。问题是，出于某种原因它不能循环。我通过Firebug进行了检查，它确实添加了我需要的所有内容。如果我再次点击书签，它就可以工作。我的结论是它没有循环。function checkJquery() { if (jQuery().dialog) { jqueryLoaded(); } else { window.setTimeout("100", checkJquery); } }checkJquery(); - Carvefx

我注意到我的脚本也没有循环。然后我意识到我忘记了首先调用checkJquery()来初始化脚本。 - TreK

Answer 2

我相信当所有脚本加载完成时，window.onload()函数应该被触发。而且你不需要将东西绑定到jQuery的'ready'事件上。

loadjscssfile("http://localhost/js/jquery-1.3.2.min.js", "js");
loadjscssfile("http://localhost/js/jquery-ui-1.7.2.custom.min.js", "js");

window.onload = function() {
    if(window.jQuery && jQuery.ui) {
        alert('loaded');
    }
}

- David Hellsing

---

这根本不起作用。第一个版本更接近工作状态。还是谢谢你的帮助！ - Carvefx