Google.setOnLoadCallback avec jQuery $(document).ready(), est-il OK pour mélanger?

j'utilise L'API Google Ajax et ils me suggèrent d'utiliser google.setOnLoadCallback() pour faire diverses choses liées à leur API, mais j'utilise aussi $(document).ready() de jQuery pour faire d'autres choses JS, non liées à L'API Google.

Est-il sécuritaire de mélanger ces deux approches dans un même document? Je n'ai pas encore remarqué de problèmes, mais je suppose que c'est une question d'échelle.

56
demandé sur zgoda 2009-02-17 14:34:02

4 réponses

Vous devez faire ceci:

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

Vous ne pouvez pas faire $(document).ready() sans $ (l'objet jQuery), de sorte que les besoins d'aller à l'intérieur de la fonction de rappel. Et vous ne pouvez pas être sûr que le document est prêt à l'intérieur du rappel, donc vous devez faire ready() aussi.

68
répondu cletus 2017-01-04 16:49:05

désolé de ressusciter les morts, mais 1) c'est quand même une 'réponse' à ce problème et 2) j'ai trouvé une meilleure solution.

il y a un 3ème argument optionnel sur la fonction google.load qui prend un objet d'options de configuration. Une des options est callback . Il élimine également la nécessité d'un appel séparé setOnLoadCallback .

E. G.

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>

voir: https://developers.google.com/loader/#Dynamic

49
répondu Dawn 2015-02-19 00:24:07

si votre code JavaScript se trouve dans son propre fichier js et non dans le document HTML, vous pouvez aussi le faire dans le document:

<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>

charge my.js après toutes les autres choses est chargé à partir de google. Dans votre fichier my.js vous pouvez alors faire $(document).ready(...) . Ainsi, votre code d'application est indépendant de" chargé par google "ou"chargé directement à partir de votre serveur".

6
répondu andy 2011-11-12 15:27:03

pourquoi mélanger quand on peut tout faire avec $(document).ready() ? Il suffit de se débarrasser de la fonction google.setOnLoadCallback et d'utiliser $(document).ready() de jQuery .

:

google.setOnLoadCallback(chartEnrollment);

devient

$(document).ready(chartEnrollment);
4
répondu Vincent 2017-01-04 17:19:24