Конфликт Jquery-Mootools

Я пытался заставить работать 2 скрипта (1 mootol и 1 jquery) на одной странице, но безрезультатно… изучал много форумов и все, но я все еще не могу заставить эти 2 работать одновременно.

Вот как это выглядит в моем заголовке:

<script type="text/javascript" src="<?php bloginfo('url'); ?>/wp-content/plugins/buddypress/bp-themes/bp-default/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript"> 
     jQuery.noConflict();
$(document).ready(function () { 
         var hide = false; 
     $("#posts-menu, .submenu").hover(function(){ 
         if (hide) clearTimeout(hide); 
         $(".submenu").fadeIn(); 
     }, function() { 
         hide = setTimeout(function() { 
             $(".submenu").fadeOut("slow"); 
         }, 250); 
     }); 

})(jQuery);
    </script>       
<script type="text/javascript" src="<?php bloginfo('url'); ?>/wp-content/plugins/buddypress/bp-themes/bp-default/js/mootools-core-1.3.2.js"></script>
<script type="text/javascript" src="<?php bloginfo('url'); ?>/wp-content/plugins/buddypress/bp-themes/bp-default/js/mootools-more-1.3.1.1.js"></script>
<script type="text/javascript" src="<?php bloginfo('url'); ?>/wp-content/plugins/buddypress/bp-themes/bp-default/js/wall.js"></script>
<script type="text/javascript" src="<?php bloginfo('url'); ?>/wp-content/plugins/buddypress/bp-themes/bp-default/js/wall-lide.js"></script>

<script type="text/javascript">
<!-- 

window.addEvent('domready',function(){


    // -- horizontal
    var myHorizontalSlide = new Fx.Slide('login-welcome-div-slide', {mode: 'vertical'});


    $('slideout').addEvent('click', function(event){
        event.stop();
        myHorizontalSlide.slideOut();
    });


});

// -->  
</script>

мне удалось сценарий mootools работать, даже если есть вызов jquery.js... вы можете видеть, что я уже использовал jQuery.noConflict(); в 3-й строке..

проблема в том, что скрипты mootool работают, если jquery.noconflict есть, но скрипты jquery не работают! Теперь, если удалить jquery.noconflict, то теперь, наоборот, скрипт jquery работает, но не скрипты mootool. Я просто не могу заставить их работать!

любая помощь будет принята с благодарностью..

Источник

6 ответов

Решение

Проблема в том, что вы не заключаете код jQuery в анонимную функцию. Попробуй это:

(function($){
    // inside here $ will always mean jQuery
    $(document).ready(function () { 
         var hide = false; 
         $("#posts-menu, .submenu").hover(function(){ 
             if (hide) clearTimeout(hide); 
             $(".submenu").fadeIn(); 
         }, function() { 
             hide = setTimeout(function() { 
                 $(".submenu").fadeOut("slow"); 
             }, 250); 
         }); 
    });
})(jQuery);
Источник

Когда ты бежишь в noConflict режим, который вы не можете использовать $ удобный метод. Вы должны использовать полную форму jQuery вместо.

jQuery.noConflict();
// Do something with jQuery
jQuery("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';

Пожалуйста, избегайте использования библиотек 2 js, так как это увеличит время загрузки вашей страницы, что, в свою очередь, имеет последствия для SEO (негативные).

Источник

С точки зрения MooTools.

Вы включаете MooTools после jQuery. Это хорошо. Поскольку (если вы не используете jQuery.noConflict), MooTools увидит, что $ уже используется кем-то еще, и оставит его как есть.

Вам придется заменить функцию $ на document.id() в ваших скриптах MooTools.

В jQuery есть режим noConflict. При его использовании вам придется заменить функцию $ из jQuery на jQuery().

Либо вы заменяете вхождения, либо можете использовать анонимные функции, чтобы сохранить ссылки на $ в ваших скриптах и ​​сделать их псевдонимом для document.id() MooTools или jQuery () jQuery.

(function($) {
    // $ will refer to MooTools' document.id() in this anonymous function
    // ...
})(document.id);

(function($) {
    // $ will refer to jQuery's jQuery() in this anonymous function
    // ...
})(jQuery);
Источник

Вы можете попробовать включить библиотеку jQuery перед библиотекой MooTools.

Этот документ должен лучше иллюстрировать

Источник

Ты забиваешь $,

<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code that uses jQuery's $ can follow here.
  });
  // Code that uses other library's $ can follow here.
</script>
Источник

Использование jQuery (с учетом регистра) вместо $ для частей JQuery.

Источник
Другие вопросы по тегам