Essence for All

Home > 03-javascript−Ajax > jQuery と prototype.js を同時に使う。($(); のコンフリクト回避)

jQuery と prototype.js を同時に使う。($(); のコンフリクト回避)

1.最初にprototype.jsを読み込ませます。
※prototype.jsで動かすプラグインも先に記述。
2.jQueryを読み込ませます。
3.jQueryの次に下記javascriptを記述
<script>
<script type="text/javascript">
jQuery.noConflict();
var j$ = jQuery;
</script>


こうすることによって
jQuery
jQuery();
j$();
prototype.js
$();
として使用できる

あとはjQueryを利用したライブラリで定義されている$をすべてj$に変更します。
jQueryの中身を変更してはいけません。

全ての"⇒$()"を ⇒"j$()"に、
$(" を "j$(" で全置換してから "$." を "j$." に置き換え



あるいは

<script type="text/javascript" src="/prototype/1.6/prototype.js"></script> 最初にprototype.jsを読み込ませます。 
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>  
<script type="text/javascript" src="js/lightbox.js"></script> ※prototype.jsで動かすプラグインも先に記述。 
<script type="text/javascript" src="/jquery/1/jquery.min.js"></script>  jQueryを読み込ませます。
<script type="text/javascript">  ここが重要
jQuery.noConflict()(function($){  
var j$ = jQuery;  
</script>
<script type="text/javascript" src="js/accordion.js"></script>
この記述ですとjQueryの$をj$に書き換えなくて大丈夫です。 




Powered by Movable Type