Question

我将jquery用于模块。我的joomla模板有一个集成的jquery菜单。所以他们互相冲突。

有没有办法解决这个问题。遵循模块的脚本代码

<script type="text/javascript" charset="utf-8">
    window.onload = function () {
        var container = jQuery('div.sliderGallery');
         var ul = jQuery('ul', container);

         var itemsWidth = ul.innerWidth() - container.outerWidth();

         jQuery('.slider', container).slider({
             min: 0,
             max: itemsWidth,
             handle: '.handle',
             stop: function (event, ui) {
                 ul.animate({'left' : ui.value * -1},340);
             },
             slide: function (event, ui) {
                 ul.css('left', ui.value * -1);
             }
         });
     };
</script>

Answer 1

解决问题需要做的是取消jQuery函数的别名并将其分配给另一个变量名（请记住：变量可以是函数）。您需要使用jQuery.noConflict()函数取消$()函数的别名。这里有一个要做：

// ...after all of Joomla's JS is done executing...

// before loading your version of jQuery var jquery = {}; // aka new Object()
jquery.joomla = jQuery.noConflict(); // moves jQuery into another namespace

// load your version

现在，当你加载你的版本时，它将接管jQuery和$命名空间，但如果你需要它，你仍然可以使用另一个引用Joomla的jQuery函数。要重新迭代，基本流程是：

加载Joomla的jQuery
运行Joomla的依赖jQuery的代码
将Joomla jQuery移动到另一个名称空间
加载您的jQuery
使用$()

Answer 2

尝试

var J = jQuery.noConflict();

之后使用J变量而不是$或jQuery作为自定义代码

Answer 3

尝试

jQuery.noConflict();

e.g

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        var container = jQuery('div.sliderGallery');
         var ul = jQuery('ul', container);

         var itemsWidth = ul.innerWidth() - container.outerWidth();
         jQuery.noConflict();
         jQuery('.slider', container).slider({
             min: 0,
             max: itemsWidth,
             handle: '.handle',
             stop: function (event, ui) {
                 ul.animate({'left' : ui.value * -1},340);
             },
             slide: function (event, ui) {
                 ul.css('left', ui.value * -1);
             }
         });
     });
</script>

我已更新您的代码以使用jQuery检查加载的文档。使用noConflict函数的详细信息是here。

Answer 4

你的意思是你的joomla同时加载了2种jquery吗？首先你的菜单加载jquery 然后你的模块加载jquery？

这是解决方案：在joomla模板中，我们可以覆盖模块或组件视图（我假设您必须正在使用joomla 1.5.x吗？）

创建一个名为html /的目录例如：templates / yourTemplate / html /
将modules / mod_yourMenu / tmpl /.*中的文件复制到你的模板html（templates / yourTemplate / html / mod_yourMenu /） - ＆gt; *您不需要添加tmpl / *
编辑里面的php文件并删除所有文件标记加载jquery
对使用jquery的模块执行步骤1-3。
编辑模板，将标记加载到最新版本的jquery。

现在应该可以工作了:)

Answer 5

只需将jq脚本包装在自调用函数中。

(function($){
   $(document).ready(function(){

      $('div').click( function(){ alert('ding'); });

   });
})(jQuery);

这会创建一个私有范围，因此您不必担心任何冲突。你可以跳过jQuery.noConflict（）的所有不安。解决方案，你不必放弃那美妙的$！当我知道在工作中有其他代码块（例如，任何cms）时，我这样做就像habbit一样 - 即使在我的测试之后添加了一个新的扩展，它也不应该破坏我的jQuery。

jQuery Cookbook中有一个很棒的概述（http://listic.ru/jQuery_Cookbook.pdf-第1.17章）。如果它对Resig来说足够好，我想这对我有用！

JQuery与其他JQuery库冲突

5 个答案: