гуглить.setOnLoadCallback с jQuery $(документ).готов (), это нормально, чтобы смешать?

Я использую Google Ajax API, и они предлагают мне использовать google.setOnLoadCallback() чтобы делать различные вещи, связанные с их API, но я использую также jQuery $(document).ready() делать другие JS вещи, не связанные с Google API.

безопасно ли смешивать эти два подхода в один документ? Я не заметил никаких проблем, но я полагаю, что это вопрос масштаба.

4 56
javascript jquery onload google-ajax-api

4 ответа:

вы в значительной степени должны сделать это:

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

вы не можете сделать $(document).ready() без $ (объект jQuery) доступен, поэтому он должен войти в обратный вызов. И вы не можете быть уверены, что документ готов внутри обратного вызова, так что вы должны сделать ready() тоже.

68

Извините, что поднимаю это из мертвых, но 1) он все еще появляется как "ответ" на эту проблему и 2) я нашел лучшее решение.

есть дополнительный 3-й аргумент google.load функция, которая принимает объект параметров конфигурации. Один из вариантов -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

если ваш код JavaScript находится в своем собственном js-файле, а не внутри HTML-документа, вы также можете сделать это в документе:

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

этой нагрузки my.js после того, как все остальное загружается из google. В вашем my.js файл, который вы можете сделать $(document).ready(...). Таким образом, ваш код приложения не зависит от "загружено google" или "загружено непосредственно с вашего сервера".

6

зачем смешивать, когда вы можете сделать все это с $(document).ready()? Просто избавьтесь от google.setOnLoadCallback функция и использование jQuery $(document).ready().

это:

google.setOnLoadCallback(chartEnrollment);

становится

$(document).ready(chartEnrollment);
4