Question

无法动态加载 jQuery UI - 未捕获 TypeError：无法读取未定义的属性“ui”

2014-09-03

1282

javascript jquery jquery-ui

我动态加载了 jQuery 和 jQuery UI 文件。jQuery 文件加载成功，但 jQuery UI 文件加载时发生错误

控制台中显示的内容如下：Uncaught TypeError：无法读取未定义的属性“ui”

我的代码如下

(function()
{
var jQuery;
if (window.jQuery === undefined)
{
    var script_tag = document.createElement('script');
    script_tag.setAttribute("type", "text/javascript");
    script_tag.setAttribute("src",
            "//code.jquery.com/jquery-1.11.0.min.js");




    if (script_tag.readyState)
    {
        script_tag.onreadystatechange = function()
        {
            if (this.readyState === 'complete' || this.readyState === 'loaded')
            {
                scriptLoadHandler();
            }
        };
    }

    else
    {
        script_tag.onload = scriptLoadHandler;
    }
    (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);

}

else
{
    jQuery = window.jQuery;

    main();
}

function scriptLoadHandler()
{
    jQuery = window.jQuery.noConflict(true);

    main();
}

function main() {

    jQuery(document).ready(function($) {
        jQuery.getScript('http://code.jquery.com/ui/1.11.1/jquery-ui.min.js', function() {
            jQuery.noConflict(true);
        });
};
})();

有人能帮我解决这个问题吗？

Answer 1

只需从 noConflict 调用中删除 true 即可；这将放弃对 $ 的控制，但保留 jQuery 以供 jQuery UI 使用：

/******** Called once jQuery has loaded ******/

    function scriptLoadHandler() {
        // Restore $ to its previous values and store the
        // new jQuery in our local jQuery variable
        jQuery = window.jQuery.noConflict(); // no argument!
        // Call our main function
        main();
    }

Answer 2

使用：

$(document).ready(function() {});

或

$(function() {});

这两个语句实际上完全相同。因此，第二个调用只是第一个调用的快捷方式。

$ 符号再次只是 jQuery 的快捷方式。如果您已将 jQuery 加载到您的网站中，则可以同时使用两者。

 (function($){
 }(jQuery));

在这里，您正在调用该匿名函数（以 $ 作为参数）并传入 jQuery 对象。