Javascript 在jQuery插件加载后执行一些操作

我正在将

jQuery

和

jqueryui

动态加载到页面中，我需要知道

jqueryui

何时成功扩展了

jQuery

目前，我正在使用加载

jqueryui

的script元素的

readystate

来触发代码的运行，但我认为此时脚本已经加载，但是

jqueryui

尚未正确初始化

是在定义

$.ui

之前进行轮询的唯一选择吗

以下是我目前正在努力解决的代码：

(load_ui = (callback) ->
    script2 = document.createElement("script")
    script2.type = "text/javascript"
    script2.src = "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.js"
    script2.onload = script2.onreadystatechange = ->
      console.log 'readystate:', @readystate
      if @readystate == "loaded" or @readystate == "complete"
        console.log "jquery ui is loaded"
        callback ($ = window.jQuery).noConflict(1), done = 1
        $(script,script2).remove()
    document.documentElement.childNodes[0].appendChild script2
    console.log 'jquery ui script element appended to page'
(window, document, req_version, callback, $, script, done, readystate) ->
  if not ($ = window.jQuery) or req_version > $.fn.jquery or callback($)
    console.log "begin loading jquery"
    script = document.createElement("script")
    script.type = "text/javascript"
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/" + req_version + "/jquery.min.js"
    script.onload = script.onreadystatechange = ->
      if not done and (not (readystate = @readyState) or readystate == "loaded" or readystate == "complete")
        console.log "jquery is loaded, now loading jquery ui"
        load_ui(callback)        

    document.documentElement.childNodes[0].appendChild script
    console.log 'jquery script element appended to page'
) window, document, "1.6.1", ($, L) ->
    console.log $
    console.log $.ui.version

由于某些原因，jquery ui脚本元素的readystate只返回未定义的值。

<script src="jquery ui"></script>
<!-- jQuery UI has been initialized -->
<script src="my source"></script>

我在某些项目中使用了此代码，以确保某些脚本按顺序运行。它在IE上不起作用（我也没有时间调试），但在其他方面效果很好

var node = document.createElement("script");
$.extend(node, {
    type: 'text/javascript',
    charset: 'utf-8',
    async: false,
    defer: true,
    src: /*...*/
});
$(node).bind('load', loadedCallback);
$('head')[0].appendChild(node);

---

我认为这将完全满足您的需要，添加更多的依赖项

(function () {
        function getScript(url, success) {
            var script = document.createElement('script');
            script.src = url;

            var head = document.getElementsByTagName('head')[0];
            var completed = false;
            script.onload = script.onreadystatechange = function () {
                if (!completed && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
                    completed = true;
                    success();
                    script.onload = script.onreadystatechange = null;
                    head.removeChild(script);
                }
            };
            head.appendChild(script);
        }

        getScript("Scripts/jquery-1.6.1.js", function () {
            getScript("Scripts/jquery-ui-1.8.11.js", function () {
                alert($.ui);
            });
        });
})();

使用IE7、IE8、IE9、Firefox、Safari、Chrome和Opera进行测试

---

我没有从外部源加载脚本，只有jquery和jquery ui在外部加载。OP提到他们正在动态加载jquery和jquery ui。我认为这意味着它们不作为

包含，而是由其他javascript加载。我通过在文档中插入脚本标记来加载它们，并在加载时运行我的代码。（至少我正试图这么做）如何在不将资源插入DOM的情况下加载资源？@Acorn:不行，我记错了那个部分。请参阅更新的答案（我没有完成的东西是异步加载程序；可能需要对IE兼容性进行一些调整）。我想说，问题在于代码。很好的解决方案！只有一个问题：加载时，为什么要从

头中删除
脚本
？它改变了什么？它在大多数页面上运行得很好，但在维基百科页面上不起作用。你能在维基百科上使用它吗？谢谢。对于success（），我总是在Chrome中收到这样一条消息：uncaughttypeerror:undefined不是一个函数。为什么我会收到这个消息？