Question

我在noConflict模式下使用 jQuery ，因为我的代码是在主机页面上运行的JS小部件。

我想让我的代码动态加载jQuery插件（qTip2），而不会干扰页面的jQuery。

问题是该插件将其$变量绑定到本地页面的jQuery。

我在调用noConflict()之前尝试加载插件并且它可以工作，但是它留下了一个全局$指向我的jQuery的时期。

这里是代码（我省略了loadJsFile功能以保持简短。它将脚本添加到头部并在加载时回调：

  (function trackJq(timesToGo) {
    if (timesToGo-- > 0) {
      log("timed");
      setTimeout(function() {trackJq(timesToGo)}, 20);
    }
  })(10)

  function isDef() { return typeof $.qtip !== 'undefined'; }

  function log (msg) { console.log(msg + " $:" + jQuery.fn.jquery + " qTip:" + isDef()); }

  log("Before loading my jQuery");
  loadJsFile("https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js", function() {
    log("After loading my jQuery");
    loadJsFile("http://cdn.jsdelivr.net/qtip2/2.2.0/jquery.qtip.min.js", function() {
      log("After loading qTip");
      $jq = jQuery.noConflict(true);
      log("After calling noconflict");

      // rest of code here...

    });
  });

和输出（显示我的jQuery接管的时间间隔）：

timed                    $:1.2.3  qTip:false
Before loading my jQuery $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false
After loading my jQuery  $:1.11.0 qTip:false
timed                    $:1.11.0 qTip:false
timed                    $:1.11.0 qTip:false
timed                    $:1.11.0 qTip:false
After loading qTip       $:1.11.0 qTip:true
After calling noconflict $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false
timed                    $:1.2.3  qTip:false

有更好的方法吗？

JQuery插件和JQuery noConflict

0 个答案: