多个 jQuery.noConflict() 实例答案

【问题标题】：Multiple jQuery.noConflict() instances多个 jQuery.noConflict() 实例
【发布时间】：2013-08-16 12:23:21
【问题描述】：

我正在使用几个 jQuery 脚本，其中包括 MenuFader (http://css-tricks.com/examples/MenuFader/)、twitter 提要和时间戳。此外，我还有几个 Mootools 脚本，其中包括 Barackslideshow (http://devthought.com/wp-content/moogets/BarackSlideshow/demo.html)。最后，我有一个滚动代码，其中包含从 twitter 主页获取的工具提示。

我最初与 Jquery MenuFader 和 Mootools BarackSlideshow 有冲突，但使用 jQuery.noconflict(); 轻松解决了这个问题；并将所有相应的 $ 替换为 jQuery。

不幸的是，在我从 Twitter 添加滚动代码后，Mootools BarackSlideshow 和 Jquery MenuFader 不再工作。

我尝试实现 jQuery.noconflict();然后 $.noconflict();然后 var j = jQuery.noconflict();并像以前一样替换 $，但我无法让脚本正常播放。

非常感谢任何帮助......我整天都在努力。我对 javascript 很陌生，但通过一点持久性设法解决了大多数问题。请看下面的脚本：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"     type="text/javascript"></script>
<script src="http://a2.twimg.com/a/1274914417/javascripts/fronts.js" type="text/javascript"></script> 

<script type="text/javascript"> 
//<![CDATA[

      $( function () {

  setTimeout(function() { $(".twtr-widget").append($("<div></div>").attr("class", "twtr-fade")); }, 0);

  (function() {
    var tabIndex = $("[tabindex]:last").attr("tabIndex");
    var setTabIndex = function() {
      $(this).attr("tabindex", ++tabIndex);
    }
    $(".footer-nav a").each(setTabIndex);
    $(".language-select a").each(setTabIndex);
  })();

    $("#signup_submit").scribe({
    event_name: "signup_submit_click",
    experiment: "ab_signup_button",
    bucket: "sign_up"
  }, "www_ab_tests");

  $('#signin_menu').isSigninMenu();

      new FrontPage().init();

      });

//]]>

【问题讨论】：

标签： javascript twitter mootools jquery

【解决方案1】：

noConflict 只是简单地改变 jQuery 库可用的名称。

这是为了更好地与其他可能也想使用名称$ 的框架配合使用，但仅此而已。它不能解决与其他框架的任何其他类型的一般冲突。例如，当一个框架使用 jQuery 的内部 ID 标记克隆、更改或删除元素时，可能会出现不可调试的奇怪错误。在单个页面上使用多个框架仍然是一个非常糟糕的主意，因为它们与 jQuery 一样广泛且具有侵入性。（尤其是 jQuery 1.3，它对它所接触的元素非常混乱。）

同样，两个在相同元素上运行的高级插件很可能会产生不希望的行为交互。假设一个插件将行为绑定到一个元素，但随后另一个插件删除了该元素以将其替换为渐进增强版本。或者一个插件试图读取一个不再具有可见宽度的元素的offsetWidth，因为另一个插件在其父级上调用了hide()。

脚本和插件可能会伪装成完全封装的行为，您可以在不了解它们的工作原理的情况下随意使用它们，但实际上并非如此。如果您将两个脚本（并非故意设计为一起工作）绑定到相同的元素，它们可能会干扰或失败。尝试将受不同插件影响的元素彼此分开，以减少这种可能性。

【讨论】：