我试图做一个东西,当点击将返回值在它的页面。下面是我的表单,现在当表单提交它需要一些时间,我想要的是它会显示加载时间,而代码得到执行
我的形式<html>
<head>
</head>
<body>
<form id="myForm" action="redirect.php" method="post">
Name: <input type="text" name="name" /><br />
Age : <input type="text" name="pass" /><br />
<button id="sub">submit</button>
</form>
<span id="result"></span>
<script src="script/jquery-1.8.1.min.js" type="text/javascript"></script>
<script src="script/script.js" type="text/javascript"></script>
</body>
</html>
my script.js file
$("#sub").click( function() {
$.post( $("#myForm").attr("action"),
$("#myForm :input").serializeArray(),
function(info){ $("#result").html(info);
});
});
$("#myForm").submit( function() {
return false;
});
我的redirect.php文件
<?php
$name = $_POST['name'];
$age = $_POST['pass'];
if($name==!NULL || $age==!NULL)
echo "Successfully returned";
echo $name;
else
echo "Returned Failed";
?>
您可以在redirect.php
的循环中给出像echo "15% done"
这样的进度消息。
假设当前你的代码是:
<?php
$N = 100000; // this is how many iterations you will make in your work
for ($i = 0; $i < $N; $i++) // This is the loop that does the work in your script
{
do some part of your work...
}
?>
要显示消息,您需要在PHP中这样做:
<?php
ob_start ();
$percent_previous = 0;
$N = 100000; // this is how many iterations you will make in your work
for ($i = 0; $i < $N; $i++) // This is the loop that does the work in your script
{
do some part of your work...
$percent = $N / ($i + 1) * 100;
if ($percent_previous != $percent) // not to show it too frequently
{
message ("$percent% done...");
$percent_previous = $percent;
}
}
// after the work done:
if ($percent_previous != 100)
progress (100);
function message ($msg)
{
echo "<!-- some 4 KB of random garbage like jhajdhsjahsjaheuwbcwuvacjacv -->";
echo $msg;
ob_end_flush ();
ob_flush ();
flush ();
ob_start ();
echo "<!-- some 1 KB of random garbage like hdsjfagdfqhwjcwwvyvcsdhalj -->";
}
?>
I echo
前后消息的长注释与垃圾<!-- hdjhsjsjdshjd ->
(约4千字节)重置网络和浏览器的缓存机制。我使用垃圾是因为如果我只使用大约4 KB的空间,它可以被压缩,并且最终传输的消息将不够大。
你可以从<span class=someclass>
开始,然后在100%后关闭这个标签;然后执行一个javascript来擦除进度消息。
当然,图像也可以这样做,你可以很好地格式化你的进度消息。
如果您只希望在计算完成后显示gif并消失,那么您可以按照以下行进行:
<html>
<body>
<?php
ob_start ();
progress ("<span id='progress'><img src='progress.gif'></span>");
// You still need the trick I described above for this to be shown in real time
// do all your long work here
?>
<script>
document.getElementById ("progress").innerHTML = ''; // This erases the image
</script>
</body>
</html>
使用OP示例代码的完整示例如下:
<html>
<body>
<?php
ob_start ();
message ("<span id='progress'><img src='progress.gif'></span>");
// You still need the trick I described above for this to be shown in real time
$name = $_POST['name']; // OP's code
$age = $_POST['pass']; // OP's code
if($name==!NULL || $age==!NULL) // OP's code
echo "Successfully returned"; // OP's code
echo $name; // OP's code
else // OP's code
echo "Returned Failed"; // OP's code
function message ($msg)
{
echo "<!-- some 4 KB of random garbage like jhajdhsjahsjaheuwbcwuvacjacv -->"; // please include here at least some 4 kilobytes of such random garbage, I will not type it here
echo $msg;
ob_end_flush ();
ob_flush ();
flush ();
ob_start ();
echo "<!-- some 1 KB of random garbage like hdsjfagdfqhwjcwwvyvcsdhalj -->"; // please include here at least some 1 kilobyte of such random garbage, I will not type it here
}
?>
<script>
document.getElementById ("progress").innerHTML = ''; // This erases the image
</script>
</body>
</html>