1

外部ユーザーが使用する.jsファイルで、自分のページにjQuery lubraryがロードされているかどうかを確認したい. そうするために、私は使用しています:

if (!window.jQuery) {
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);
}    

$(document).ready(function () {
    //do some jquery $.ajax({}); stuff
});

しかし、$(document).ready(function () {エラーメッセージが表示される行で、ReferenceError: $ is not definedそれを修正するにはどうすればよいですか?

編集:

行を追加しました

if (!window.jQuery) {
    ...
    document.getElementsByTagName('head')[0].appendChild("<script type='text/javascript'>$(document).ready(function () {...});</script>");
} 

そして今、私はNS_ERROR_XPC_BAD_CONVERT_JS: Could not convert JavaScript argument arg 0 [nsIDOMHTMLHeadElement.appendChild]

4

4 に答える 4

1

document.ready 部分を削除し、jQuery をヘッドに追加するために使用しているスクリプト タグの下にある別のスクリプト タグで、次のようにします。

<script>
 window.onload = function() {
   //do the same code in here as you would've done in document.ready
 }
</script>

編集

以下のコメントは良い点です...その場合、これを行います:

<script>
 (function() {
     var load = function() {
       //do the same code in here as you would've done in document.ready
     };

     if(window.addEventListener) {
        window.addEventListener('load',load);
     } else {
        window.attachEvent('onload',load);
     }
 }());
</script>
于 2012-12-04T12:09:21.747 に答える
1

そのような場合、人々は通常、require.jsのようなものを試すように求められます...それを使用したくない場合は、独自のハンドラーを設定して、jquery がロードを終了する瞬間を捉えることができます。

if (!window.jQuery) {
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);

    var loadHandlerAlreadyRun = false;
    script.onload = function() {
        if (!loadHandlerAlreadyRun) {
           loadHandlerAlreadyRun = true;
           onLoadHandler();
        }
    };
    script.onreadystatechange = function() {
        if (!loadHandlerAlreadyRun && (this.readyState === "loaded" || this.readyState === "complete")) {
            loadHandlerAlreadyRun = true;
            onLoadHandler();
        }
    }
}    

function onLoadHandler() {
    $(document).ready(function () {
        console.log("jquery loaded");
        //do some jquery $.ajax({}); stuff
    });

}

ここで試してみてください

于 2012-12-04T12:08:41.613 に答える
0

このようなもの

if( window.jQuery === undefined ) {
    //create script tag for appending script source
    var scriptTag = document.createElement("script");
    scriptTag.type = "text/javascript";
    //check for IE
    if( scriptTag.readyState ) {
        scriptTag.onreadystatechange = function() {
            if( scriptTag.readyState == 'loaded' || scriptTag.readyState == 'complete' ) {
                scriptTag.onreadystatechange = null;
                scriptHandler();
            }
        };
    }
    else {
        scriptTag.onload = function() {
            scriptHandler();
        };
    }
    scriptTag.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js";
    ( document.getElementsByTagName("head")[0] || document.documentElement ).appendChild( scriptTag );
}
else {
    jQuery = window.jQuery;
    process();
}

function scriptHandler() {
    jQuery = window.jQuery.noConflict( true );
    process();
}
function process() {
    jQuery(document).ready(function($) {
        //use $ here
    });
}
于 2012-12-04T12:11:27.300 に答える
0

コードで確認できます:

if (typeof jQuery == 'undefined') {  
    // jQuery is not loaded
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);
}
于 2012-12-04T11:55:14.313 に答える