javascript - jQuery 无法正常工作，可能与 Prototype 冲突？

Question

我很抱歉这个模糊的标题。

我正在为我公司的网站制作一个新主题，并且页面上有 jQuery 选项卡和滑块。

选项卡和滑块都不起作用 - 我不太清楚为什么。我继承了设计并简单地更改了主题 - 我认为这可能与加载多个 jQuery 脚本有关 - 滑块抛出该方法.split()不存在的错误，并且选项卡无法正常工作他们应该。

Answer 1

你应该做这个：

<action method="addJs"><script>jquery/jquery.js</script></action>
<action method="addJs"><script>jquery/jquery.plugin.js</script></action>
<action method="addJs"><script>jquery/jquery.moreplugin.js</script></action>
<action method="addJs"><script>jquery/jquery.noConflict.js</script></action>

<action method="addJs"><script>prototype/prototype.js</script></action>

在 page.xml 布局中。

jquery.noConflict.js 文件：

var jQuery = $.noConflict();

之后，您可以随心所欲地调用 jQuery() 函数。顺序为：jquery -> jquery 插件 -> jquery 无冲突 -> 原型

Answer 2

Explosion Pills 是对的——你应该使用 jQuery.noConflict。先导入 jQuery，然后，在导入 Prototype 之前，插入该行

<script type="text/javascript">
    jQuery.noConflict();
</script>

如果你这样做，那么在你的应用程序中引用 jQuery 的其他任何地方，都可以使用jQuery(...)orjQuery.代替$(...)or $.。它不应该弄乱你的脚本导入，除非你正在导入的那些脚本写得不好并且没有为自己定义 $ 。

Answer 3

I prefer to use the following snippets:

<script type="text/javascript">
  jQuery.noConflict();
  (function($) {
    $.ajax(...);
  })(jQuery);
</script>

, which won't conflict with Prototype and remain to use '$' for jQuery. Here's some more information: http://www.magentogarden.com/blog/using-jquery-in-magento-with-good-programming-practice.html