2

我正在构建一个可以包含在许多不同网站上的小部件。这个小部件将需要使用 jQuery。我的客户将通过一个标签安装我的小部件，该标签将包含在他们的</body>标签之前（就像 Google Analytics 的工作原理一样）

对于如何处理每个人的网站环境不同的问题，我有点茫然。

目前我的解决方案是在我的 JS 代码中动态加载 jQuery 和 jQueryUI，它们将包含在它们的</body>标签之前。但是，如果他们已经在他们的网站上加载了 jQuery，这会导致问题。

我搜索了一个解决方案来检测他们是否已经通过以下方式包含了 jQuery：

if (typeof jQuery == 'undefined') { 
  // include jQuery 
}
if (typeof jQuery.ui == 'undefined')
{
  // include jQueryUI
}

但是，当他们已经加载了 jQuery 时，这会导致问题......似乎他们的网站上已经包含了 jQuery，我的 JS 小部件无法访问已经从客户网站加载的 jQuery 库，因为我得到了一个错误说它无法识别“$”。

我确信这个问题以前已经解决了，但我似乎找不到答案。

更新

为了澄清一点......我上面包含的代码没问题，它不会引起问题。以下是用例：

用例 1

  1. 用户的网站上没有 jQuery
  2. 我的 JS 脚本动态加载 jQuery 并等待脚本完成加载
  3. 一切都很好

用例 2

  1. 用户在他们的网站上确实有 jQuery，但没有 jQueryUI
  2. 我的 JS 脚本仅动态加载 jQueryUI 并等待脚本完成加载
  3. 我的 JS 文件尝试调用 $.ajax 并失败:(

用例 3

  1. 用户在他们的网站上确实有 jQuery，并且确实有 jQueryUI
  2. 我的 JS 脚本不需要加载任何东西，所以它不需要
  3. 我的 JS 文件尝试调用 $.ajax 并失败:(

所以问题是...

为什么我的 JS 文件在加载 jQuery 本身时只能访问 $.ajax（和其他 jQuery 函数）？

4

2 回答 2

0

try using this instead:

if(typeof(jQuery) === undefined){
    //load jquery
}
else{
    //jquery already there

    if(typeof(jQuery.ui) === undefined){
        //load jquery ui
    }
}

UPDATED

于 2013-10-04T20:21:13.063 回答
0

好的，事实证明代码和我所拥有的一切工作正常......只是我安装我的小部件的一些网站必须使用$“命名空间”而不是jQuery。

所以我必须通过我的客户端 JS 文件并将所有出现的“$”替换为“jQuery”。

例子

更改$.ajax({});
为：jQuery.ajax({});

更改$("#textbox").change(function () {});
为：jQuery("#textbox").change(function () {});

于 2013-10-05T18:43:38.437 回答