iiweb

Webデザイナーの日記・忘備録

jQuery競合に悩みました

よくある、jQuery複数使用による競合...。

以前$にjを付ける作業で動くように設定したことがありましたが、

プログラミング内の$をすべて変えていくので、とても大変な作業でした。

 

調べてみると意外と簡単に解決できる方法がありました。

 

状況ですが、競合した3種類のjQueryがあります。

~簡単なイメージ~

<html >
<head>

1.一番上のjQuery

2.中段のjQuery

3.下段のjQuery

</head>

 

順番など変えてみて、1.一番上のjQueryと3.下段のjQueryは動きました。

1.一番上のjQueryjQuery(function($) なので、2.中段と3.下段が$、$で競合、下段が勝って2.中段動かず...という感じのようでした。

 

調べてみると $.noConflict();だけで問題解決できるそうです。2.中段のみに対応したところ、動くようになりホッとしています。

 

追加部分緑色▽

<script src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
    var jQuery190 = $.noConflict();
</script>
<script type="text/javascript">
jQuery.noConflict();

(function($){
  (function(){  .............
            }
    });
});
})(jQuery);
</script>

 

教えてくれたブログさんです。

http://rei19.hatenablog.com/entry/2013/03/25/000818

http://api.jquery.com/jquery.noconflict/

ありがとうございました。