スクリプトが動かない時はコレ!JQueryとprototype.jsの競合を避けるための方法!

2012/04/10 (2016/09/14更新) タグ: , ,
  • このエントリーをはてなブックマークに追加

JQueryとprototype.jsを同時に使おうとすると、競合してそれぞれのスクリプトが動かない…よくある話ですが、こんな時の回避策のTipsです。

SPONSOR

jQuery.noConflict();を使うと解決します。これはjQueryの変数に使われている「$」を「jQuery」に置き換えて競合を回避するというもの。ということなので、jQueryで使っている$の箇所を全てjQueryに置き換えるだけでOKです。

たとえばこんなスクリプトの場合

$(function(){
        $("ul.sub_list").hide();
            $("ul#ul_menu>li").hover(function(){
                $("ul:not(:animated)",this).slideDown("fast")
            },
            function(){
                $("ul",this).slideUp("fast");
            })
     });

↓ ↓ ↓

jQuery.noConflict();
jQuery(function(){
        jQuery("ul.sub_list").hide();
            jQuery("ul#ul_menu>li").hover(function(){
                jQuery("ul:not(:animated)",this).slideDown("fast")
            },
            function(){
                jQuery("ul",this).slideUp("fast");
            })
     });

簡単に使えるのでおすすめです。

この記事もおすすめ
記事を書いている中の人
入江慎吾
デザインも開発もやっているフリーのエンジニアです。目標はプロダクトだけで生きていくこと。そのために学んだこと、実践したことをブログで発信中。朝5時に起きて午前中だけ働いています。午後からは読書と勉強にあてて自己スキルをのばし、さらに生産性を高めたいと考えてます。(もっと詳しいプロフィール
この記事をシェアする
  • このエントリーをはてなブックマークに追加
メールマガジンで新着記事をフォロー

 

イリテクの最新情報をチェック!
  • follow us in feedly
    RSSで最新記事を読む
イリテクで開発したプロダクト
SPONSOR
こちらの記事もおすすめです