0

私が制御できないフレームワーク内で実行されるウィジェットを開発しています。私のウィジェットは、フレームワークがかなり恐ろしい古いバージョンを使用している jQuery の最新バージョンを使用しています。

最近、コードに問題があり、（最終的に）それが jQuery の競合の問題であることがわかりました。

ウィジェットの形式は少し奇妙で、このフレームワーク/テンプレート内で iframe として実行されます。

widget.onloadjQuery doc ready 関数の代わりに関数を使用します。別のクラスを初期化するために、そこで 1 つまたは 2 つの関数を実行する傾向があります。

<script type="text/javascript">
//<![CDATA[

    MyClass = {
        init : function() {
            // Where I build my "pseudo-class"
        }
    }

    widget.onLoad = function(){
        /* My code goes here */

        MyClass.init();
    };

//]]>
</script>

これは問題ではありません。これは単なるコンテキストです。通常、次のように通常どおり jQuery を実行できます。

widget.onLoad = function(){
    /* My code goes here */

    var id = $('a.student_iframe_popup').attr("id");
    MyClass.init(id);
};

また、ウィジェット内の他のスクリプトも通常どおり javascript で参照します。

<script type="text/javascript" src="/user/74/187887.js"></script> <!-- jQuery 1.10.2 -->
<script type="text/javascript" src="/user/74/188165.js"></script> <!-- jQuery bPopup -->
<script type="text/javascript" src="/user/74/188166.html"></script> <!-- Student Flags Iframe Popup -->

リンクした最後のスクリプトは、多くのウィジェット スクリプトで使用する単純な関数です。

  $('body').on("click", ".student_iframe_popup", function() {
        $('body').append('<iframe></iframe>');

    var student_id = 'student_' + $(this).attr("id");

    $('iframe').attr("width", 800);
    $('iframe').attr("height", 600);
    $('iframe').attr("id", student_id);
    $('iframe').attr("src", '/index.phtml?d=825090');

    $('iframe').bPopup({
        modalClose: true,
        escClose: true,
              opacity: 0,
        position: ['auto', 10]
    });
  });

これはすべて正常に動作します - IE では、一部のウィジェットでランダムなバグが発生します。以下を利用するようにコードを変更すると...

widget.onLoad = function(){
    /* My code goes here */
    jQuery.noConflinct();

    var id = jQuery('a.student_iframe_popup').attr("id");
    MyClass.init(id);
};

そして、参照スクリプト$をjQueryすべて正常に動作するように変更します。「バグ」は魔法のように消えます。

しかし、私はスクリプトで多くのドル記号を使用しており、すべてをCTRL+H置き換えた今では非常に読みにくくなり、新しいコードを入力するのに当然時間がかかります。$jQuery

私が通常の HTML/JS ドキュメントを書いていた場合、$(blah)代わりに次のコードを使用して引き続き使用できることがわかっていますjQuery(blah)。

jQuery( document ).ready(function( $ ) {
    // You can use the locally-scoped $ in here as an alias to jQuery.
    $( "div" ).hide();
});

しかし、私はドキュメント対応機能を使用していないため、noConflict のバリアントを実装する方法がわかりません。

私のウィジェットフレームワーク内で機能するより良い代替手段を誰かが提供できますか?

4

1 に答える 1