web-dev-qa-db-ja.com

jQuery $(document).ready()を使用したgoogle.setOnLoadCallbackは、混合しても大丈夫ですか?

私はGoogle Ajax APIを使用していますが、google.setOnLoadCallback()を使用してAPIに関連するさまざまなことを行うことを推奨していますが、jQueryの$(document).ready()も使用して、 Google API。

これら2つのアプローチを1つのドキュメントに混在させることは安全ですか?私はまだ何の問題にも気づいていませんでしたが、それは規模の問題だと思います。

56
zgoda

あなたはほとんどこれをする必要があります:

_google.setOnLoadCallback(function() {
  $(function() {
    // init my stuff
  });
});
_

_$_(jQueryオブジェクト)が利用可能でなければ$(document).ready()を実行できないため、コールバック内に配置する必要があります。また、コールバック内でドキュメントの準備ができていることを確認できないため、ready()も実行する必要があります。

68
cletus

これを死者から上げてすみませんが、1)この問題に対する「答え」としてまだ現れています。2)より良い解決策を見つけました。

google.load関数にはオプションの3番目の引数があり、構成オプションのオブジェクトを受け取ります。オプションの1つはcallbackです。また、別個のsetOnLoadCallback呼び出しの必要性も取り除きます。

例えば。

google.load('visualization', '1.0', {
    'packages': "charttype", 
    'callback': $jQ.proxy(me.setupChart, me)
});

そう:

<script src="https://www.google.com/jsapi"></script>
<script>
$(document).ready(function () {
    function mapsLoaded() {
        etc etc etc
    }

    google.load("maps", "2", {"callback" : mapsLoaded});
});
</script>

参照: https://developers.google.com/loader/#Dynamic

49
Dawn

JavaScriptコードがHTMLドキュメント内ではなく、独自のjsファイル内にある場合は、ドキュメント内でこれを行うこともできます。

_<script>
        google.load("jquery", "1.7.0");
        google.load("jqueryui", "1.8.16");
        google.setOnLoadCallback(function() {
             var script = document.createElement("script");
             script.setAttribute("type", "text/javascript");
             script.setAttribute("src", "my.js");
             document.getElementsByTagName("html")[0].appendChild(script);
        });
</script>
_

これは、他のすべてのものがGoogleからロードされた後に_my.js_をロードします。 _my.js_ファイルで、$(document).ready(...)を実行できます。そのため、アプリケーションコードは「Googleからロード」または「サーバーから直接ロード」から独立しています。

6
andy

$(document).ready()ですべてができるのに、なぜミックスするのですか? _google.setOnLoadCallback_関数を取り除き、jQueryの$(document).ready()を使用するだけです。

これ:

_google.setOnLoadCallback(chartEnrollment);
_

なる

_$(document).ready(chartEnrollment);
_
4
Vincent