MooTools 和 jQuery 冲突 - 尽管有美元安全模式

Question

我正在尝试让一些预先存在的 MooTools 代码在 Drupal 站点中正常运行。我知道 MooTools 代码可以自行运行。一旦我在页面中加载 MooTools 库，jQuery 就会停止运行。

我在 jQuery 之后添加了 MooTools，这（根据 MooTools 开发人员的说法）应该可以防止 Moo 从已加载的 jQuery 库中窃取已定义的 $。

我已将 Moo 代码中 $ 的所有引用转换为 document.id。

当我加载页面时，Moo 代码可以工作，但 jQ 代码却不能。看来 Moo 仍在从 jQ 窃取 $ 变量并为自己重新定义它。出于测试目的，我加载的 Moo 代码是一个简单的 12 Accordion 脚本。如果解决这个问题，我需要使用更复杂的方法。

Drupal 广泛使用 jQuery，因此使用 jQ 的 no_conflict 模式不是一个可行的选择。据我了解，鉴于美元安全模式，这应该是可能的。

我正在使用 MooTools Core 1.2.4 和 MooTools More 1.2.4.4 和 jQuery 1.2.6（也尝试过 1.4.2）。

Answer 1

奇怪的是，老实说，这不是应该发生的事情。从 mootools 1.2.3(?)（可能是 1.2.1）开始，如果页面上已经定义了 $，它将不会接管 $ 的分配。也就是说，如果加载顺序如下所述：

jquery
mootools

...然后moootools将自动进入兼容模式并恢复为document.id。唯一不成立的情况是，如果 jquery 正在 noConflict 模式下加载，这将阻止它将 jQuery 分配给 $，并且不会让 mootools 没有理由不获取它。

无论如何，这就是理论。如果您看到不同的行为，则说明浏览器出现问题。您是延迟加载还是非阻塞/并行加载脚本？

这里的最佳实践通常是，将 jquery 保留在本机模式（无冲突）并将 $ 重新分配给 document.id 以在如下范围内处理 mootools：

<div id="foo"></div>

然后：

$("#foo"); // jquery

(function($) {
    $("foo"); // mootools.
})(document.id);

最近有很多关于这个主题的问题，只需阅读最新的 mootools 问题即可。如果失败，请发布您的项目的 URL。

显然，您可以 console.log($) 来检查/确认这一点：
http://www.jsfiddle.net/AxVqy/ ->测试用例

Answer 2

您始终可以使用 jQuery()，而不是使用 $ 来访问 jQuery 函数。

您甚至可以在使用 .ready() 时传递您自己的标识符，例如：

jQuery(document).ready(function(myIdentifier){

   myIdentifier(); // this is the jQuery reference!

});

Answer 3

你为什么不使用jQuery而不是$？
如果出于任何原因你不能这样做， noConflict(); 并不意味着你必须停止使用 $ for jQuery，你可以这样做：

<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code that uses jQuery's $ 
  });
  // Code that uses mootools $ 
</script>

你可能在使用带有插件的 jQuery 时遇到问题将其 $(function(){} 替换为 jQuery(document).ready(function($) {});

请注意，我首先加载了 mootools，你也可以这样做代码的每一部分都是这样的：

(function($) {
    $("id"); // mootools.
})(document.id);


(function($) {
    $("#id"); // jQuery.
})(jQuery);

我遇到了类似的问题，正在寻找一种解决方案来加载所有或一个或任意不同库的组合，一旦我弄清楚如何做到这一点，我相信我可以与您分享。你肯定能够做到这一点，但是上面的解决方案应该适合你，我已经成功地使用它来加载 jQuery 和 mootools 以及我想要的任何顺序。

Answer 4

这更多地取决于您的案例中使用的插件。 jQuery 本身可能工作正常，但如果插件不是按照他们的推荐编写的，它将无法工作。

Answer 5

如果我必须同时使用两者，我会首先包含 jQuery，然后包含 Mootools (1.3)。如果您不需要费心使用 jQuery，它不会发生冲突，因为 Mootools 兼容性会自动启动，然后为 Mootools 和 jQuery 定义 $ 以获得快速快捷方式，即 (function($){ / *东西*/ })(document.id) 等