0

私はjqueryを初めて使用します。JavaのHTMLページにJqueryを追加しようとしています。jquery.jsファイルを含めるために、次のコードを記述しました。

scriptTag += "var script = document.createElement('script');" + 
"script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'; " +
"script.type = 'text/javascript'; " +
"document.getElementsByTagName('head')[0].appendChild(script);" +

次に、次のjs+jqueryコードを追加しました

"var script2 = document.createElement('script'); window.onload = function() {" +
"$(document).ready(function() {" +
"$(\"#identity\").hide();});};" +
"script2.type = 'text/javascript'; " +
"document.getElementsByTagName('head')[0].appendChild(script2);";

だから基本的に私はこれを書こうとしています:

var script = document.createElement('script');
script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'; 
script.type = 'text/javascript'; 
document.getElementsByTagName('head')[0].appendChild(script);
var script2 = document.createElement('script');
 window.onload = function() {
   $(document).ready(function() {
      $("#identity").hide();
   });
  };
script2.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script2);

私がやりたいのは、ウィンドウのロード後に関数が欲しいということです。どういうわけか、$(document).ready(function() { 単独で書くことはうまくいきません。$が定義されていないというエラーが表示されます(jquery.jsの準備ができていないようです)。

この問題を回避するために、私はを使用しwindow.onload = function() {ました。しかし今、私はエラーを受け取っています:$(document).ready is not a function。私はここでこのことを書く方法について本当に混乱しています。これは正しいアプローチですか?どんな助け/ガイダンスも大歓迎です。

[編集]

次のコード(jqueryなし)は正常に機能することに注意してください。

window.onload = function() {
document.getElementById('identity').style.visibility='hidden';
};

[編集]

実際、私はWebプロキシを作成しており、ページをダウンロードして、カスタムのルックアンドフィールドで提供しています。ページにはjqueryファイルが含まれていません。また、HTMLを含めたり書き込んだりすることもできません。Jを動的に追加するには、javaなどを使用する必要があります。

4

2 に答える 2

1

次のコードは、スクリプト ファイルを動的にロードし、そのファイルがロードされるまで $(document).ready の呼び出しを遅らせる方法を示しています。

http://jqfaq.com/how-to-load-java-script-files-dynamically/

于 2012-07-02T10:49:22.710 に答える
1

jquery.min.js ファイルをロードするために使用するコードは、非同期的に呼び出されます。おそらく、jquery 関数を実行しようとした時点では、このファイルはロードされていません。したがって、コールバック関数を使用してファイルがロードされていることを確認する必要があります。

次のリンクでは、この方法の例を見つけることができます: http://blog.logiclabz.com/javascript/dynamically-loading-javascript-file-with-callback-event-handlers.aspx

また、ここに実際の例があります:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>index</title>
    <script type="text/javascript">

        function loadScript(sScriptSrc, callbackfunction) {
            //gets document head element
            var oHead = document.getElementsByTagName('head')[0];
            if (oHead) {
                //creates a new script tag
                var oScript = document.createElement('script');

                //adds src and type attribute to script tag
                oScript.setAttribute('src', sScriptSrc);
                oScript.setAttribute('type', 'text/javascript');

                //calling a function after the js is loaded (IE)
                var loadFunction = function() {
                    if (this.readyState == 'complete' || this.readyState == 'loaded') {
                        callbackfunction();
                    }
                };
                oScript.onreadystatechange = loadFunction;

                //calling a function after the js is loaded (Firefox)
                oScript.onload = callbackfunction;

                //append the script tag to document head element
                oHead.appendChild(oScript);
            }
        }

        var SuccessCallback = function() {
            $("#identity").hide();
        }

        window.onload = function() {

            loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', SuccessCallback)

        };
    </script>
</head>
<body>

    <span id="identity"> This text will be hidden after SuccessCallback </span>

</body>

このコードを scriptTag 変数で使用する必要があります。その後、 eval() 関数を使用して、この変数でスクリプトを評価できます。また、jquery の getscript 関数を使用して、コールバック関数で 2 番目の JavaScript ファイルを読み込むこともできます。

于 2012-07-02T11:58:19.547 に答える