主页正在加载时运行ajax

我得到了这个PHP脚本，生成需要20到30秒才能完成的报告。我想添加一个进度条，并且正确更新数据库中的进度。主页正在加载时运行ajax

问题是，我不能使用jQuery到$.post或$.get，而主页面正在加载报告。

我可以运行JavaScript，就像弹出一个窗口，上面写着“请稍候”，并显示一个小旋转图标，但firefox拒绝在主页面加载时发送ajax post/get。

任何方法？我试图把它扔在一个iframe中，但这并没有奏效。（我监视使用Firebug HTTP实时头的流量。）

2009-09-30 nolanpro

您可以在报表中jQuery的负载当网页加载，例如：

$(document).ready(function() { 
    $('#someDiv').html('<strong>Loading...</strong>') 
       .load('report.html'); 
});

对于一个进度条，退房jQuery UI Progressbar。这就是说，手动使这声音一点：

如果实际完成百分比状态无法计算，不确定进度条（即将推出）或微调动画是一种更好的方式来提供用户反馈。

，所以如果是这样的话，我会建议一个动画形象微调这样或用适当的消息，例如：

$(document).ready(function() { 
    $('#someDiv').html('<img src="images/spinner.gif"/><strong>This could take a while...</strong>') 
       .load('report.html'); 
});

来源

2009-09-30 17:26:55 karim79

+1 - 用于指向进度条的链接。您也可以在设置页面时开始下载，然后在页面完成时显示数据。在页面完成之前，Javascript可以进行ajax调用。 – 2009-09-30 17:31:33

谢谢，我没有想到用ajax加载实际报告。我认为这将解决它。 – nolanpro 2009-09-30 21:28:31

Jquery UI是一个可怕的臃肿解决方案。 – 2011-05-06 15:10:51

你可能要考虑elementReady。如果你确定你的jquery脚本加载并且你的页面的一部分在费时报告开始处理之前被写出，你可以使用elementReady来启动某种通知。无需等待整个文档准备就绪。

我不确定这是否可以与ui进度条一起使用，但是我已将它与thickbox一起用于灰显并阻止对屏幕的输入，直到页面完全加载并且thickbox throbber .gif运行良好足以作为活动指标。

来源

2009-09-30 17:49:58 Sorpigal

我打算也玩，我可以使用PHP来刷新（）一些指令的浏览器之前，它的硬报告的东西。 – nolanpro 2009-09-30 21:29:33

要添加AJAX页面加载动画效果：第1步：添加jQuery库

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

第2步：添加一些CSS给炫酷的外观（可选） 3步：添加下面的jQuery

<script> 

(function($){ 

$("html").removeClass("v2"); 

$("#header").ready(function(){ $("#progress-bar").stop().animate({ width: "25%" },1500) }); 
$("#footer").ready(function(){ $("#progress-bar").stop().animate({ width: "75%" },1500) }); 

$(window).load(function(){ 

    $("#progress-bar").stop().animate({ width: "100%" },600,function(){ 
$("#loading").fadeOut("fast",function(){ $(this).remove(); }); 
}); 

}); 
})(jQuery); 
</script>

第4步：最后，添加html代码，无论你想要的。

来源

2012-08-30 04:40:50

主页正在加载时运行ajax

回答

相关问题