Eu tenho um script jQuery que inicia duas ou mais operações assíncronas ao mesmo tempo, e gostaria de executar um callback quando todas elas estiverem concluídas. Um exemplo seria iniciar uma animação para esconder a página atual, enquanto faço uma requisição Ajax para carregar o conteúdo da próxima página. Tanto a animação pode terminar primeiro, quanto a requisição. Após ambas estarem terminadas, gostaria de exibir a página nova.
Eu não gostaria que a página nova fosse exibida antes que a anterior estivesse totalmente escondida, nem que o fosse antes de seu conteúdo estar pronto. De modo que o callback final não deve estar nem em um nem em outro evento.
Como fazer? De preferência, estou buscando por uma solução genérica, que funcione com dois ou mais eventos assíncronos simultâneos (é raro, mas poderia por exemplo ter de fazer mais de uma requisição Ajax simultânea, e só executar o callback após ter todos os resultados).
Nota: fiz a pergunta para JavaScript, no geral, mas uma solução específica para jQuery (por exemplo, algo envolvendo Deferred
s ou Promise
s) também estaria de bom tamanho.