Command disabled: index


̃Gg[͂ĂȃubN}[Nɒlj

jQuery :: コンフリクト対策



prototype.js 等のライブラリと併用する時にコンフリクト対策を行う。

  • 「$() 関数」は、jQuery 以外でも多くのライブラリが採用している為、コンフリクトが発生してしまう。


ライブラリのロード順序

  • 例えば、prototype.js と併用する場合「jquery.js」は最後にロードします
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>


コンフリクト対策

対策1)

  • 「jQuery」を使う
<script type="text/javascript">
    jQuery.noConflict();
    jQuery("div").html("<b>Hello!</b>");
</script>


対策2)

  • 「$」を引数で渡す
<script type="text/javascript">
    jQuery.noConflict();
    (function($) { 
        $(function() {
            // ここにjQueryの処理内容を記述します。
        });
    })(jQuery);
</script>


対策3)

  • 「$j」を定義する
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(function(){
        // ここにjQueryの処理内容を記述します。
    });
</script>



個人的には 対策3 がおすすめ。



追記: 2010-02-15

以下の書き方もあるようです。

<script type="text/javascript">
    jQuery(function($){
        // ここにjQueryの処理内容を記述します。
        // この中では$はjQueryとして扱われます。
    });
</script>



programming/javascript/jquery/anti_conflict.txt