Question

我已经构建了一个JavaScript小部件，必须可以在任何环境中的任何第三方网站上嵌入。该小部件依赖于jQuery和jQuery UI。我按照How to embed Javascript widget that depends on jQuery into an unknown environment中的步骤以负责任的方式添加jQuery - 非常适合嵌入jQuery。但是当我尝试添加jQuery UI时，它失败了。这是代码：

(function(window, document, version, callback) {
  var j, d;
  var loaded = false;
  if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js";
    script.onload = script.onreadystatechange = function() {
        if (!loaded && (!(d = this.readyState) || d == "loaded" || d == "complete")) {
            callback((j = window.jQuery).noConflict(1), loaded = true);
            j(script).remove();
        }
    };
    document.documentElement.childNodes[0].appendChild(script)
  }
})(window, document, "1.3.2", function($, jquery_loaded) {
    $.getScript('http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js', function(){
      console.log('loaded');
    });
});

当我运行它时，我得到'加载'消息，然后在jquery-ui.js的第15行上出现错误，说“$ is undefined”。但是当我使用$ .getScript（）来加载jQuery UI时，如何才能定义$？为什么我在收到错误之前会看到“已加载”消息？根据jQuery文档，在脚本加载并执行之前，getScript不应该执行回调。

有什么方法可以使用这个框架来包含jQuery UI，还是我需要使用像RequireJS这样的脚本加载器来加载所有内容，强制执行依赖项等？

Answer 1

通过调用.noConflict(1)，与.noConflict(true)相同，您将删除jQuery，只需删除1。 .noConflict()的true参数告诉jQuery不仅要删除$，还要删除window.jQuery jQuery UI之后尝试使用的 it 负荷。

You can test it here，请参阅控制台中没有错误。

为什么jQuery UI没有看到jQuery？

1 个答案: