Выполнить код JS после завершения обратного вызова setTimeout ()

Question

Выполнить код JS после завершения обратного вызова setTimeout ()

0

У меня есть следующий код:

function newGraphic() {
  $.post('./lexiconGraph.pl', {
    'tag' : this.getAttribute('apolo'),
    'apoloKey' : this.id,
    'h' : surface.h,
    'w' : surface.w,
    'operation' : 'newGraphic'
  }, function(result) {
    minGraphic();
    // STOP AND WAIT //
    document.getElementById('container').innerHTML = result;
    getNodes();
    // STOP AND WAIT //
    maxGraphic();
  });
}

function minGraphic() {
  if (z > 0.01) {
    zoom(parseFloat(z - 0.01));
    setTimeout('minGraphic();', 5);
  }
}

Проблема в том, что функция minGraphic создает "эффект анимации" неизвестной продолжительности (зависит от размера графика). Мне нужно найти способ сделать следующие строки выполняются только при завершении функции minGraphic.
Кто-нибудь знает, как я могу это сделать?

ПРИМЕЧАНИЕ. Поместите следующие строки в функцию minGraphic, это не опция, так как я уже использую эту функцию в другом месте.

Júlio Pradera 24 сен. 2013, в 15:40

Источник

Теги:

javascript

jquery

2 ответа

1

Вы можете использовать обратный вызов?

function minGraphic(callback) {
  if (z > 0.01) {
    zoom(parseFloat(z - 0.01));
    setTimeout($.proxy(minGraphic, this, callback), 5);
    return;
  }
  callback && callback();
}

Затем просто вызовите функцию:

minGraphic(function () {
    //complete
});

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

plalx 24 сен. 2013, в 11:53

Ещё вопросы

Eli Gassert · Accepted Answer · 2013-09-24T11-30-00.000Z

Используйте обратный вызов для завершения анимации. Что-то вроде этого:

function newGraphic() {
  $.post('./lexiconGraph.pl', {
    'tag' : this.getAttribute('apolo'),
    'apoloKey' : this.id,
    'h' : surface.h,
    'w' : surface.w,
    'operation' : 'newGraphic'
  }, function(result) {
    var afterAnimation = function()
    {
      document.getElementById('container').innerHTML = result;
      getNodes();
      maxGraphic();
    };

    minGraphic(afterAnimation);
  });
}

function minGraphic(cb) {
  if (z > 0.01) {
    zoom(parseFloat(z - 0.01));
    setTimeout(function() { minGraphic(cb); }, 5);
  }
  else
  {
    if(cb) cb();
  }
}

Если я буду правильно следовать, то что это будет делать, это запустить запуск miniGraphic, передав обратный вызов функции, которая будет выполнена после завершения анимации (т.е. z не> 0,01). Когда это событие произойдет, если обратный вызов (cb) был передан, он вызовет эту функцию, тем самым вызывая следующий шаг в анимации.

Если у вас есть вещи, вам нужно подождать по методу maxGraphic, тогда вы можете принять ту же концепцию.

Кроме того, если jQuery доступен для вас, jQuery имеет встроенные способы для обратных вызовов после анимации, которые вы можете использовать. См. Эту документацию