HOME > 開発メモ > Prototype.jsとJqueryを共存して使う方法
2012/07/30 (2016/09/14更新) タグ: , ,

Prototype.jsとJqueryを共存して使う方法

  • このエントリーをはてなブックマークに追加

Javascriptをかんたんに扱うことができるPrototype.jsとJquery。Webサイト制作に携わっていると色んなプラグインを使うことがあります。その際に問題になるのがコンフリクト(衝突)。Prototype.jsとJqueryは「$」を関数として使っているため、問題を起こしてしまい、そのままでは使えません。

SPONSOR

Jqueryの方が後発のライブラリのためか、回避策があります。まず、先にPrototype.jsを読み込みます。そして、その後にJqueryを読み込ませます。

<script type="text/JavaScript" src="prototype.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script>
jQuery.noConflict();
var j$ = jQuery;

var j$ = jQuery;
    j$(function(){
        j$("ul.sub_list").hide();
            j$("ul#ul_menu>li").hover(function(){
                j$("ul:not(:animated)",this).slideDown("fast")
            },
            function(){
                j$("ul",this).slideUp("fast");
            })
     });
</script>
<script type="text/javascript" src="jqueryプラグイン.js"></script>

こうして、この後にjqueryのプラグインを読み込ませます。
その際、jqueryプラグイン内で使用している「$」を「j$」に置き換えます。
こうすることで、Prototype.jsとJqueryの共存が可能です。

この記事をシェアする
  • このエントリーをはてなブックマークに追加

SPONSER

こちらの記事もおすすめです

お役にたちましたら、メール購読もどうぞ!

 

イリテクの最新記事をお届けします

イリテクの最新情報をチェック!
  • follow us in feedly
    RSSで最新記事を読む
イリテクのプロフィール
入江 慎吾
System & Design Developer。イリテク株式会社 代表取締役。自社企画でクラウド見積請求書作成サービス「CLOUD PAPER」を開発・運営。仕様を決めずに少ない予算でも開発をスタートできる「開発までできるシステム顧問サービス」を実施中。(もっと詳しく
開発したWebサービス
開発したアプリ
新着記事
カテゴリ/タグ
SPONSER