重定向 10 秒倒计时 [英] Redirect 10 second Countdown

问题描述

我有一个页面，它在 10 秒后使用以下代码重定向用户.

I have a page which redirects a user after 10 seconds with the following code.

<META HTTP-EQUIV="refresh" CONTENT="10;URL=login.php">

然后我有这段在 PHP 中回显的代码，并且希望10"(秒)动态倒计时为 10、9、8、7……这样用户就可以看到秒数直到页面重定向.

I then have this code which is echo'd in PHP, and would like the "10" (seconds) to countdown dynamically as 10, 9, 8, 7... so the user can see the seconds left until the page redirects.

echo "We cant find you on the system. <br/> Please return to the <b><a href='login.php'>Login</a></b> page and ensure that <br/>you have entered your details correctly. 
<br>
<br>
<b>Warning</b>: You willl be redirected  back to the Login Page <br> in <b>10 Seconds</b>";

我想知道是否有一种方法可以在 PHP 中完成此操作，如果没有，实现相同目标的最佳方法是什么?

I was wondering if there was a way that this can be done in PHP, if not what would be the best way to achieve the same?

推荐答案

以下内容会立即将用户重定向到 login.php

The following will redirect the user right away to login.php

<?php
header('Location: login.php'); // redirects the user instantaneously.
exit;
?>

您可以使用以下命令将重定向延迟 X 秒，但没有图形倒计时(感谢 user1111929):

You can use the following to delay the redirection by X seconds but there is no graphical countdown (thanks to user1111929):

<?php
header('refresh: 10; url=login.php'); // redirect the user after 10 seconds
#exit; // note that exit is not required, HTML can be displayed.
?>

如果您想要图形倒计时，这里是 JavaScript 示例代码:

If you want a graphical countdown, here's a sample code in JavaScript:

<p>You will be redirected in <span id="counter">10</span> second(s).</p>
<script type="text/javascript">
function countdown() {
    var i = document.getElementById('counter');
    if (parseInt(i.innerHTML)<=0) {
        location.href = 'login.php';
    }
if (parseInt(i.innerHTML)!=0) {
    i.innerHTML = parseInt(i.innerHTML)-1;
}
}
setInterval(function(){ countdown(); },1000);
</script>

这篇关于重定向 10 秒倒计时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！