当小部件实例化自己的jQuery依赖时避免jQuery冲突

Question

我正在重构一个HTML小部件(社交图标类型)的代码，其中原始开发人员将小部件应用程序编写为jQuery扩展。小部件如下所示调用，并使用$. noconflict()，但是已经实例化了jQuery的页面与小部件调用的jQuery有冲突。

是否有任何解决方法有jQuery调用两次?在某些页面上，它似乎覆盖了在小部件标记之前添加的其他jQuery扩展，请参阅下面的源代码。实际的小部件是另一个文件，这是从标签加载的初始化代码，并导致jQuery冲突。

    var xRemote = 'http://assets.xxxx.com/webwidget/',
    jquerySrc = xRemote + 'lib/jquery/jquery-1.11.1.min.js';
    var appStart = function () {
        // callback loader
        var callback = function () {
            $.getScript(xRemote + "app/easyXDM/easyXDM.min.js", function (data, status, jqxhr) {
                $.getScript(xRemote + "lib/jquery/jquery.xdomainrequest.min.js", function (data, status, jqxhr) {
                    $.getScript(xRemote + "app/public/js/jsonlite.js", function (data, status, jqxhr) {
                        $.getScript(xRemote + "app/public/js/xxx.js", function (data, status, jqxhr) {
                            var $j = jQuery.noConflict();
                            $j('body').xxxxxwidgetextension();
                            $j('head').append('<meta name="viewport" content="width=device-width" />');
                        });
                    });
                });
            });
        }
        createStyleLink();
        loadjQuery(jquerySrc, callback);
    }
    // create link to stylesheet
    function createStyleLink() {
        var ss = document.createElement("link");
        ss.type = "text/css";
        ss.rel = "stylesheet";
        ss.href = xRemote + "app/public/css/xxxwidget.css";
        document.getElementsByTagName("head")[0].appendChild(ss);
    }
    // load jQuery with callback
    function loadjQuery(url, callback) {
        // create <script> tag
        var s = document.createElement("script");
        s.src = url;
        if (s.addEventListener) {
            s.addEventListener("load", callback, false);
        }
        else if (s.readyState) {
            s.onreadystatechange = callback;
        }
        document.body.appendChild(s);
    }
    appStart();

Answer 1

你就不能检查一下jQuery是否已经加载了吗?

if(jQuery == undefined){
    loadjQuery(jquerySrc, callback);
} else {
    callback();
}