Question

我正在动态地将jQuery和jQuery UI加载到页面中，我需要知道jQuery UI何时成功扩展jQuery。

目前我正在使用加载readystate的脚本元素的jQuery UI来触发我的代码的运行，但我认为此时脚本已加载，但{ {1}}尚未正确初始化。

在定义jQuery UI之前，是唯一选择投票吗？

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

$.ui

由于某种原因，jquery ui脚本元素的readystate只返回undefined。

Answer 1

我认为这将完全符合您的需求，可以根据需要添加更多依赖项。

(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进行测试

Answer 2

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

Answer 3

我在某些项目中使用了此代码，以确保某些脚本按顺序运行。它在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);

一旦jQuery插件加载就做一些事情

3 个答案: