Question

我使用以下脚本发出了ajax请求...

 $.ajax({
 type: 'POST',
 url: 'load.php',
 data: 'page='+url,
 dataType: "html",
 beforeSend:function(){

 $('.left').html('<div class="ajax-load"><center><img    src="http://www.cadysalley.com/img/loader.gif" style="margin-top: 33px;" alt="Loading..." /></center></div>');
$('#ajax-load').show();
 },

 success:function(msg){
$('.left').empty();
// successful request; do something with the data
if(parseInt(msg)!=0)
        {

            $('html, body').animate({ scrollTop: 0 }, 0);
            $('.left').html(msg);
            $('#ajax-load').hide();
        }
  },
  error:function(){  

 $('.left').empty();
 $('#ajax-load').hide();
 }
});

我的问题是，无论何时我点击链接，微调器都会启动，然后弹出警报后，弹出警报后，整个网站暂停几秒钟，除非新页面已加载,,, ...我希望我的网站不要暂停并继续微调加载，直到整个网站完全加载ajax调用

Answer 1

您正在放置ajax-load div的div中设置新内容。

$('.left').html('<div class="ajax-load"><center><img    src="http://www.cadysalley.com/img/loader.gif" style="margin-top: 33px;" alt="Loading..." /></center></div>');

 $('.left').html(msg);
 $('#ajax-load').hide();

您需要将ajax-loader放在$（＆＃39; .left＆＃39;）容器的旁边。

编辑

ok do this. 
setTimeout(function() {
   $('.left').empty();
// successful request; do something with the data
if(parseInt(msg)!=0)
    {

        $('html, body').animate({ scrollTop: 0 }, 0);
        $('.left').html(msg);
        $('#ajax-load').hide();
    }
}, 100);

这样就可以了。

Answer 2

尝试这样做..完全加载你的网站..在你的（'.left'）div之前添加一个div ..隐藏（'。left'）直到数据加载..然后显示你的ajax加载器..当完成数据通过ajax完成后，你隐藏你的ajax并显示你的（'.left'）..

像这样..添加一个css类

.hideIT{
visibility:hidden;      
}

beforeSend:function(){

 $('#newDiv').html('<div class="ajax-load"><center><img    src="http://www.cadysalley.com/img/loader.gif" style="margin-top: 33px;" alt="Loading..." /></center></div>');
$('.left').addClass('hideIT');
$('#ajax-load').show();
 },

 success:function(msg){
$('.left').empty();
// successful request; do something with the data
if(parseInt(msg)!=0)
        {

            $('html, body').animate({ scrollTop: 0 }, 0);
            $('.left').html(msg);
            $('#ajax-load').hide();
            $('.left').removeClass('hideIT');

        }
  },

我的网站停止，直到整个内容加载？

2 个答案: