Jquery No Conflict - Onclick関数 - 複数のフレームワーク

Question

私は複数のJSフレームワークを実行していて、内容は単に要素テキストを変更するものがあるonClick="changeText()"です。私のスクリプトで私が持っている

jQuery(document).ready(function($){ 
    function changeText(){ 
     $('#test').text('Hello World!'); 
    } 
}); 

私はJquery.ready機能がすべてそれを捨てていると信じています。私のデバッガでは、私のchangeText()関数が見つからないことを教えています。スクリプトは100％読み込み中です（私はビュー経由で見ることができます：ソース - > jsリンク）。また、それが私の他のフレームワークとしてロードされてMootoolsでJoomla 1.5を実行している違いがある場合。

私はJquery.ready関数なしで標準のhtmlページでそれらを正常に実行できるので、関数が100％正しいことも知っています。

これを呼び出すファイルを指定する方法はありますか？あなたのjqueryのスクリプトタグを使用すると、関数内でjQueryをラップすることができます$ jの

Answer 1

、

var $j = jQuery.noConflict(); 

。ちなみに、$は、jQueryのエイリアスにすぎず、これはjQueryの実際の名前空間です。すべてのすべてで、それは次のようになります。

(function($){ 
    $(function(){ 

     //do regular jQuery as needed 

     function changeText(){    //your function 
      $('#test').text('Hello World!'); 
     } 

     $('element').on('click',function(){ //onclick handler 
      changeText(); 
     }); 

    }); 
}(jQuery)); 

---

@ThiefMasterがコメントとして、あなたはまだあなたが私のラッピングを破棄してもよいjQueryを使用して$を提供します。

などのインラインイベントを追加するには、<button onclick="doSomething()">のように、グローバル名前空間にあるイベントのみをトリガします。一度jQueryで関数をラップすると、それはもはやグローバル名前空間の一部ではありません。ラップされたコードの代わりにJSを使用してイベントハンドラをアタッチする方が良いでしょう。

Answer 2

にjQueryの変数を変更します直後the documentationから

Answer 3

最高のオプションは、インラインイベントをまったく使用していません。代わりに$('selector').on('click', function() { ... })を使用してください。

何らかの理由でこれを実行できない場合でも、引き続きインラインイベントを使用できます。しかし、関数を別の関数の中で定義しているので、関数をグローバルにする必要があります。あなたは、ブラウザ環境でグローバルオブジェクトあるwindowオブジェクトに追加することによってそう：

window.changeText = function() { 
    // ... 
};