Question

我必须加载2个单独的内容，然后打开一个气球div到页面。两个内容都需要1秒钟才能加载。所以我在第二内容加载函数的回调中打开div。

$("#term").load("/static/page/terms.html");

$("#term-realtor").load("/static/page/terms-realtor.html", function(){
   $("div#balloon").fadeIn(500);
});

我的问题是大部分时间第二个内容比第一个内容花费更多时间加载。但有时第一个比第二个更长。然后气球div开始显示甚至认为第一内容尚未完成加载。我的问题是如何在完成加载后调用回调？提前谢谢。

Answer 1

如果你想并行执行这两个电话，我建议$.get使用$.when：

$.when(
  $.get('/static/page/terms.html'),
  $.get('/static/page/terms-realtor.html')
).then(function(response1, response2) {
  $('#term').html(response1[0]);
  $('#term-realtor').html(repsonse2[0]);
  $('div#balloon').fadeIn(500);
});

当然还有其他方法，您可以向$.get调用添加回调并在那里设置HTML。要了解有关承诺的更多信息，请查看jQuery tutorial。

Answer 2

怎么样：

$("#term").load("/static/page/terms.html", function(){
      $("#term-realtor").load("/static/page/terms-realtor.html", function(){
       $("div#balloon").fadeIn(500);
      });
    });

2 html内容加载后回调

2 个答案: