我在PHP主页面中包含了一个PHP脚本。
帮助我"如何显示一个Preloader/加载动画或gif或swf或简单的加载百分比,而包含的PHP脚本进程&加载?"下面是我想显示相同内容的代码片段(参见最后一行代码):
<body onLoad="document.forms.form1.from.focus()">
<font face="Calibri">
<table cellpadding="10">
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" name="form1">
<tr>
<td width='25%'>
<fieldset>
<legend>Enter From & To Date</legend>
<table border='0'>
<tr>
<td>From </td>
<td><input type="text" name="from" /></td>
</tr>
</fieldset>
<input type="submit" name="submit" value="Submit" />
</td>
</tr>
</form>
</table>
<?
//Form submitted
if(isset($_POST['submit']))
{
//No errors, process
if(!@is_array($error))
{
HERE IS WHERE I WANT THE LOADING TO TAKE PLACE
//HERE I INCLUDE THE SCRIPT
另外,如果我可以延迟显示PHP脚本,直到它完成处理。
将包含加载屏幕的<div>
放在<body>
之后(或者至少在耗时的加载发生之前)。在最后(或在应该被加载屏幕覆盖的长部分之后)添加一些JavaScript来隐藏/删除包含加载屏幕的div。
这是我从网上得到的一个脚本的修改版本。对不起,我记不起从哪儿弄来的了。
<html>
<head>
<script type="text/javascript">
function swapdiv() {
//Hide the loading div
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('loadingdiv').style.display = 'none';
} else {
if (document.layers) { // Netscape 4
document.loadingdiv.display = 'none';
} else { // IE 4
document.all.loadingdiv.style.display = 'none';
}
}
//Show the results div
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('resultdiv').style.display = 'block';
} else {
if (document.layers) { // Netscape 4
document.resultdiv.display = 'block';
} else { // IE 4
document.all.resultdiv.style.display = 'block';
}
}
window.onunload = null;
return;
}
</script>
</head>
<body>
<form name="form1">
</form>
<div id='loadingdiv' align='center'><img src='../images/loading.gif' alt='Loading...' title='Loading...' /></div>
<div id='resultdiv' style='display:none;'>
<!-- Do some html stuff here. This div block is hidden until the end of page load -->
<?php
//Query database
//Show results
?>
</div>
<script type='text/javascript'>
//this is called after page loaded
window.onload=swapdiv;
</script>
</body>
</html>