Дождитесь окончания анимации, затем вернитесь

Question

У меня есть приложение Google Maps, которое изменяет размер карты div, если оно слишком большое, проблема, с которой я столкнулся, заключается в том, что я пытаюсь использовать Jquerys animate и возвращаю функцию до ее завершения, и мне нужно вызвать Googleотображает, что оно было изменено.

Поэтому карта масштабируется и устанавливает границы до ее срабатывания, таким образом смещая ее.и только правильно работает, когда он срабатывает во второй раз.

function doResize() {
    if ($("#map_div").width() > 600) {
        $("#stores").hide(0, function(){
            $("#map_div").animate({width: '500px'}, function(){
                google.maps.event.trigger(G_MAP, 'resize');
                $("#stores").fadeIn(1000);
            });
        });
    }
}

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

Обратите внимание, как при первом щелчке newyork его смещение, а не по центру, затем щелкните другое состояние и снова нажмите на New York.

Редактировать:

Так как я не могу сделать анимацию синхронной и выполнять:

while($("#map_div").width() > 500) {
    $("#map_div").width($("#map_div").width() - 1)
}

не совсем гладко, я решил отказаться от анимации.Принуждение Jquery к асинхронному запуску иногда приводит к провалу.Особенно, когда сам javascript является однопоточным, вы можете подумать, что у него будут варианты ожидания до его завершения.

Answer 1

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

И все же, это именно то, что вы должны делать & mdash; или, скорее, вы не хотите перемещать код там, просто добавьте к нему вызов из обратного вызова. Вы не можете задержать возврат функции, ожидающей завершения анимации, просто нет способа сделать это в JavaScript. Различные способы, которыми вы можете попытаться это сделать (ожидание и т. Д.), Не работают. Неважно, что это происходит только один раз, вам все равно нужно использовать обратный вызов.