4

場合によっては、次のような JavaScript を使用して jQuery をロードする必要があるとします。

 <script type="text/javascript">
    if (typeof jQuery == 'undefined') 
    {
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);
    }
 </script>

しかし、JQuery がロードを完了して使用できるようになったことをどのように知るのでしょうか。

4

4 に答える 4

7

動的にロードされたスクリプトがロードされたことを検出するコードを作成する必要がありますが、残念ながら、一部の古いブラウザーでは動作が少し異なるため、それほど単純ではありません。これを行う方法に関する優れたリファレンス記事は次のとおりです。http ://www.ejeliot.com/blog/109

その記事のコードの一部を次に示します。

function loadScript(sScriptSrc, oCallback) {

    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');

    // make sure callback isn't run more than once
    function runCallback() {
        if (oCallback) {
            oCallback();
            oScript.onload = oScript.onreadystatechange = null;
            oCallback = null;
        }
    }

    oScript.type = 'text/javascript';
    // most browsers
    oScript.onload = runCallback;
    // IE 6 & 7
    oScript.onreadystatechange = function() {
        if (this.readyState === 'complete') {
            runCallback();
        }
    }
    oScript.src = sScriptSrc;
    oHead.appendChild(oScript);
}

または、これを実行する小さなライブラリの1つを使用することもできます。これらのいくつかのリストは、http://microjs.com/#loaderで確認できます。プライマリライブラリのロードを支援するために、さらに別のライブラリを使用するかどうかはわかりませんが。

于 2012-06-22T17:14:44.013 に答える
2

onloadイベントを試す:

 //.....
 script.onload = function(){
     alert('jQuery is loaded succesfully').
 };
 script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js";
于 2012-06-22T17:15:37.050 に答える
0

jfriendの答えを称賛します。コールバックはセクシーです。

それに2番目のクラック。

function loadJQ(callback) {
  if(!window.jQuery) {
    // Create jQuery script element.
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = 'path/to/jquery.js';
    document.body.appendChild(script);

    script.onload = function(){ callback(jQuery); };
    // IE 6 & 7 ala jfriend00
    script.onreadystatechange = function() {
      if (this.readyState == 'complete') callback(jQuery);
    }
  } else {
    callback(jQuery);
  }
}

呼び出し

loadJQ(function($){
  alert($ === jQuery); // true. jquery is loaded.
});
于 2012-06-22T17:18:55.863 に答える
-4

コードを入れることができます

$(document).ready(function() {
   // Handler for .ready() called.
});

ドキュメントは次のとおりです。http://api.jquery.com/ready/

編集:質問が間違っていると思います。したがって、ロードされていることを確認する方法には答えられませんが、lib をロードする別の方法を提供できます。

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write("\x3Cscript src=\"path/to/js/jquery-1.7.1.min.js') }}\">\x3C/script>")</script>

ここでは、Google API が利用できない場合、jQuery のローカル バージョンが読み込まれます。上記の抜粋よりも、jQuery がロードされていることを十分に認識している必要があります。

于 2012-06-22T17:11:34.650 に答える