複数のjQueryプラグインを読み込む際の問題

Question

複数（2）のjQueryプラグインを使用する際に問題があります。私は少しgoogledしかし、私はそれがかなりシンプルだとは思うが、実際には解決策を見つけることができません。私はjQueryを初めて使っていますので、穏やかにしてください。

私はそれを短くしようとします。私は2つのプラグインを持っています：1つのdrag'n'drop（Prototype and Scriptaculousを使用）と1つのツールチッププラグイン（TipTip）。私はこれを使用して関数を呼び出す

<script type="text/javascript" src="js/jquery-1.3.2.js"></script> 

<script type="text/javascript" src="js/prototype.js"></script> 
<script type="text/javascript" src="http://webdesign.torn.be/tutorials/assets/js/scriptaculous/scriptaculous.js?load=effects,dragdrop"></script> 

<script type="text/javascript" src="js/jquery.tipTip.js"></script> 
<script type="text/javascript" src="js/jquery.tipTip.minified.js"></script> 

：これは、ファイルとライブラリをロードするために使用するコードです

// CALLING THE TIPTIP-PLUGIN 
<script type="text/javascript"> 
    $(function(){ 
    $(".heroStr").tipTip(); 
    }); 
</script> 

// CALLING THE DRAG'N'DROP-PLUGIN 
<script type="text/javascript"> 
    //<![CDATA[ 
    document.observe('dom:loaded', function() { 
     var changeEffect; 
    Sortable.create("selectedSetupTop", {containment: ['listStr', 'listAgi', 'listInt', 'selectedSetupTop', 'selectedSetupMid', 'selectedSetupBot', 'selectedSetupFor'], tag:'img', overlap:'vertical', constraint:false, dropOnEmpty: true, 
     onChange: function(item) { 
      var list = Sortable.options(item).element; 
      $('changeNotification').update(Sortable.serialize(list).escapeHTML()); 
      if(changeEffect) changeEffect.cancel(); 
      changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" }); 
     },   
     onUpdate: function(list) { 
      new Ajax.Request("saveImageOrder.php", { 
       method: "post", 
       onLoading: function(){$('activityIndicator').show(), $('activityIndicator2').hide()}, 
       onLoaded: function(){$('activityIndicator').hide(), $('activityIndicator2').show()}, 
       parameters: { data: Sortable.serialize(list), container: list.id } 
      });    
     } 
    }); 
    }); 
// ]]> 
</script> 

私はドラッグ＆ドロップの作品上記のコードを使用しています。 PrototypeファイルとScriptaculousファイルを削除した場合、TipTipは機能しますが、drag'n'dropはもちろん機能しません。

どのようにして両方を同時に管理できますか？集会は事前に感謝します。

/cheezen

Answer 1

jQueryと他のライブラリは、その機能のほとんどのための$変数を使用します。複数（jQuery、Prototype、MooToolsなど）を含めると、互いを踏み合わせることがあります。 tipTipを使用するときは、jQuery変数に戻ります。 （あなたは一度だけ含める必要がある）

$.noConflict(); //Release the $ variable 
jQuery(function($){ //Shorthand for $(document).ready(), callback locally renames jQuery to $ 
    $(".heroStr").tipTip(); 
}); 

はまた、あなたが同時に両方を使用することができますが、プロトタイプは、それは別の枠組みで、jQueryプラグインではありません。

Answer 2

jQuery.noConflict()docsを使用すると、$のjQueryとPrototypeの衝突を避けることができます。

代わりに、プロトタイプ+ scriptaculousの代わりにjQueryUIを使用してドラッグアンドドロップを処理することをお勧めします。また、jQueryを最新のバージョンにアップデートすることをお勧めします。使用しているものは実際には古くなっています。