web-dev-qa-db-ja.com

jQueryとプロトタイプの競合

プロトタイプを使用するアコーディオンメニューもあるHTMLページでjQuery AutoCompleteプラグインを使用しています。

どちらも完全に別々に動作しますが、両方のコンポーネントを1つのページに実装しようとすると、理解できないエラーが発生します。

キャッチされない例外：[Exception ... "コンポーネントがエラーコードを返しました：0x80004005（NS_ERROR_FAILURE）[nsIDOMViewCSS.getComputedStyle]" nsresult： "0x80004005（NS_ERROR_FAILURE）"場所： "JSフレーム:: file：/// C：/ Documents and Settings /Administrator/Desktop/website/js/jquery-1.2.6.pack.js :: anonymous :: line 11 "data：no]

JQueryと競合するファイルは、アコーディオンメニューで使用される「effects.js」であることがわかりました。このファイルを新しいバージョンに置き換えてみましたが、新しいバージョンではアコーディオンの動作が壊れているようです。

私の推測では、アコーディオンで使用される「effects.js」ファイルは、アコーディオンのデモ出力を取得するように変更されたと思います。また、jQueryが他のライブラリとの競合を回避するために必要なオーバーライドメソッドを使用してみましたが、機能しませんでした。

アコーディオンのデモは stickmanlabs.com から入手しました。

そして、jQuery AutoCompleteは jQuery site から取得できます。

他の誰かがこの問題を経験しましたか？

jqueryautocompleteprototypejsaccordionconflict
27
DPereyra

2つの可能な解決策があります。古いバージョンのScriptaculousおよびjQueryとの競合がありました（ScriptaculousはネイティブArrayプロトタイプを誤って拡張しようとしました）-最初にScriptaculousのコピーをアップグレードしてみてください。

それが機能しない場合は、（上記で言及したように）noConflict()を使用する必要があります。ただし、落とし穴があります。プラグインをインクルードしているので、インクルードを特定の順序で行う必要があります。例えば：

<script src="jquery.js"></script>
<script src="jquery.autocomplete.js"></script>
<script>
  jQuery.noConflict();
  jQuery(document).ready(function($){
    $("#example").autocomplete(options);
  });
</script>
<script src="prototype.js"></script>
<script src="effects.js"></script>
<script src="accordion.js"></script>

これが状況の明確化に役立つことを願っています。

117
John Resig

jQueryでは、jQuery関数の名前を$から別の名前に変更して、他のライブラリとの名前空間の競合を回避できます。

あなたはこのようなことをすることができます

var J = jQuery.noConflict();

詳細はこちら： michaelshadle.com — jQueryの非競合モード：それが最も優れているもう1つの理由

10
Tahir Akhtar

この場合、両方のライブラリを同時に使用する理由はわかりません。

Prototype（実際にはScriptaculous '） Ajax.Autocompleter を使用してjQueryを捨てるか、jQueryの Accordion を使用してPrototypeを取り除くことができます。

両方のライブラリを一度に使用することは、あまり良い考えではありません。

  1. それらは衝突を引き起こす可能性があります。
  2. 両方を含めることで、ユーザーに両方のダウンロードを強制します。これは、友好的なアプローチではありません。
8
Fczbkk