javascript - Ajax加载网页有矛盾的两种情况

Question

我正在使用 jquery 中的 Ajax 加载函数来加载 DOM 中的另一个页面。通过使用这个

$('.upload').on('click',function(){

 $('.content').load('loo.php');

});

当我使用此功能时，分区内容中的页面会在 3-4 秒间隔后加载。

我想用那个间隔显示进度条，所以我用了这种方式

$('.upload').on('click',function(){

       $.ajax({
           url: 'loo.php',
         beforeSend:function(){

           res.container.append(res.loader); //Showing loader

         },
         success:function(){

            $('.content').load('loo.php');
             res.container.find(res.loader).remove(); //Hiding Loader 

               }

       });

});

所以现在发生的事情是，加载程序出现并显示了几次，然后分页加载，但问题是我再次看到加载程序隐藏后页面加载延迟。我创建了加载器来克服时间，但是加载器运行后仍然需要时间。

在 Firebug 中，通过分析请求，页面在加载器之后开始加载，这是我不想要的。任何想法，如何克服这个问题。

Answer 1

您正在 AJAX 请求完成之前删除“加载器”。在 load() 完成后，您应该在回调函数中删除加载程序。也不需要双重 AJAX 请求。

$('.upload').on('click',function(){
   res.container.append(res.loader); //Showing loader
  $('.content').load('loo.php', function(){
             res.container.find(res.loader).remove(); //Hiding Loader 

    });
});