Jquery-Mootoolsのコンフリクト

Question

私は2つのスクリプト（1つのmootolと1つのjquery）を同じページで無駄にするように努力しています。多くのフォーラムを研究していますが、私はまだ2つの作業を同時に行いません。

これは、それは私のヘッダにどのように見えるかです：...私もtheresの場合jquery.jsコールを仕事にMooToolsのスクリプトを管理

<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> 

あなたは私はすでに第三にjQuery.noConflict();を使用していることがわかります

問題は、jquery.noconflictが存在するにもかかわらずjqueryスクリプトが機能しない場合、mootoolスクリプトが機能することです。今、jquery.noconflictを削除するとjqueryスクリプトは動作しますが、mootoolスクリプトは動作しません。

ヘルプの任意の種類を大幅にjQueryの部分に..

Answer 1

問題は、匿名関数内で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); 

Answer 2

使用jQuery（大文字と小文字を区別）の代わり$を理解されるであろう。

Answer 3

noConflictモードで実行すると、$の便利な方法を使用できません。代わりにフルフォームjQueryを使用する必要があります。それは順番にSEOへの影響（マイナスのもの）を持っているあなたのページの読み込み時間が長くなりますよう

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

2つのJSライブラリの使用は避けてください。

Answer 4

あなたは$を壊しています。

<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> 

Answer 5

MooToolsライブラリの前にjQueryライブラリを含めることができます。

このdocumentは、ビューのMooToolsの点から、より良い

Answer 6

を説明する必要があります。

あなたはjQueryの後にMooToolsを含めています。それは良い。 （もしあなたがjQuery.noConflictを使わなければ）、MooToolsは$が他の誰かによってすでに使われているのを見て、それをそのまま残します。

MooToolsスクリプトの$ functionをdocument.id（）に置き換える必要があります。

jQueryにはこのnoflflictモードがあります。それを使用するときは、jQueryの$関数をjQuery（）に置き換える必要があります。

オカレンスを置き換えるか、匿名関数を使用してスクリプト内の$への参照を保持し、MooToolsのdocument.id（）または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);