在纯 PHP 中重定向之前的倒数计时器答案

【问题标题】：CountDown Timer Before Redirect In Pure PHP在纯 PHP 中重定向之前的倒数计时器
【发布时间】：2014-10-11 03:58:43
【问题描述】：

我正在使用我在下面分享的纯 JavaScript 倒计时计时器，以便在一段时间后重定向到 URL，并向访问者显示剩余时间。

<form name="redirect" id="redirect"> 
You Will Be Redirected To Next Page After  <input size="1" name="redirect2" id="counter"></input>Seconds.
</form> 
<script type="text/javascript"> 
var countdownfrom=5
var currentsecond=document.redirect.redirect2.value=countdownfrom+1 
function countredirect(){ 
if (currentsecond!=0){ 
currentsecond-=1 
document.redirect.redirect2.value=currentsecond 
} 
else{ 
showIt() 
return 
} 
setTimeout("countredirect()",1000) 
} 
countredirect() 
function showIt() {
window.location.href = "http://jsfiddle.net/";
} 
</script>

现在我想要相同的功能和特性，并在纯 PHP 中工作，因为您知道许多旧的移动浏览器仍然不支持 JavaScript，并且许多正在使用 JavaScript 阻止程序。那么这是否可以在纯PHP 中做同样的事情，没有<script> 标签。

更新：

我知道下面的代码，但我也想要一个倒数计时器来显示给访客。

<?php header('Refresh: 5; URL=http://jsfiddle.net/'); ?>
<meta http-equiv="refresh" content="5;url=http://jsfiddle.net/">

【问题讨论】：

@HassanHey 这不能仅使用 php 完成，您需要使用 jquery 或 javascript。 PHP 是一种服务器端脚本语言，您必须使用客户端语言来完成此任务
@Utkarsh 谢谢。这是完美的答案。请在下面添加答案..

标签： javascript php html redirect

【解决方案1】：

答案：

这不能仅使用 php 完成，您需要使用 jquery 或 javascript。 PHP 是一种服务器端脚本语言，您必须使用客户端语言来完成此任务。

提示：

用于重定向目的只需使用 php 中的header() 函数在一段时间内重定向 php 文件。您的代码应该如下所示

<?php
    header( "refresh:5;url=http://jsfiddle.net" );
?>

希望对你有帮助...

【讨论】：

兄弟，我已经编辑了我的答案，请选择正确的答案

【解决方案2】：

如果你想要一些输出，你不能使用header()。或者，您可以执行以下操作：

echo "<pre>";
echo "Loading ...";

ob_flush();
flush();

$x = 0;
while($x <= 4) {
    $x++;
    echo '<br/>'. $x;
    ob_flush();
    flush();
    sleep(1);
}

echo '<meta http-equiv="refresh" content="0;url=http://jsfiddle.net/">';

【讨论】：

你的代码让我投了赞成票。休息我只想显示剩余的秒数，而不是像5,4,3,2,1。这是否可以在剩余时间内仅显示一个字符 jsfiddle.net/7tg9nvjv ？
@MuhammadHassan 好吧，如果你想要一个递减倒计时，只需将计数器初始化为 5，然后在循环内递减它，关于一个一个，你不能这样做，这就是限制
这意味着我选择了正确的答案。感谢您确认更多信息。

【解决方案3】：

PHP 是一种服务器端语言。如果没有一些相当复杂的设置，您将无法通过 PHP 控制浏览器的行为方式。即便如此，您也无法保证在没有 JavaScript 的情况下显示倒计时的行为。对于限制 JavaScript 执行的浏览器，Refresh 标头可以正常工作。然而，对于那些启用了 JavaScript 的用户（这是当今大多数浏览器，桌面和移动设备），一个简单的标题不会提供任何 UI 反馈，并且对于期望响应式应用程序和网页的用户来说是令人沮丧的。

因此，如果可用，可以添加 JavaScript，以增强自动、延迟、重定向并为用户提供一些关于正在发生的事情的反馈。禁用 JavaScript 的用户只会看到一个静态页面，告诉他们该页面将被重定向，以及他们需要等待多长时间。

PHP

<?php

  $redirectTimeout = 5;   // seconds

  header('Refresh:' . $redirectTimeout . ';url=http://jsfiddle.net');

  // ...

  // inside your <head>, add this
  echo '<meta http-equiv="refresh" ' . 
             'content="' . $redirectTimeout . ';url=http://jsfiddle.net">';

  // ...

  // inside your <body>, add this (or something similar)
  echo '<div>' . 
         'You will be redirected to next page after ' .
         '<span id="redirectCountdownLabel">' . 
           $redirectTimeout . 
         '</span> seconds' .
       '</div>';

  // ...

  // add JS below

JavaScript

对于这一部分，我推荐你使用 jQuery。它不仅可以编写更安全和跨浏览器的 JS，还可以让你的代码更小更漂亮。这部分可以放在您的 HTML 中的任何位置，也可以放在您使用 <script> 标记添加的 .js 文件中。为方便起见，您甚至可以使用 CDN 添加 jQuery。

!function() {

$(function () {
  var meta = $('head meta[http-equiv="refresh"]');
  var label = $('#redirectCountdownLabel');
  var loadTime;
  var refreshTimeout;

  if (meta.length && label.length) {
    loadTime = window.performance.timing.domComplete;
    refreshTimeout = parseInt(meta.attr('content'), 10); // seconds

    new Timer(refreshTimeout * 1000, loadTime).start(200, function (elapsed) {
      // "elapsed" ms / 1000 = sec
      label.text(refreshTimeout - parseInt(elapsed / 1000));
    });
  }
});

function Timer(maxTime, startTime) {
  var timeout;
  var callback;

  startTime = startTime || Date.now();

  function nextTimer(delay) {
    timeout = setTimeout(function () {
      var curTime = Date.now();
      var elapsedTime = curTime - startTime;

      callback(elapsedTime);

      if (elapsedTime < maxTime) {
        nextTimer(delay);
      }
    }, delay);
  }

  this.start = function start(ms, cb) {
    stop();
    callback = cb;        
    nextTimer(ms);
  };

  this.stop = function stop() {
    if (timeout) {
      clearTimeout(timeout);   
    }
  };
};


}();

（注意：这是Timer 类的jsfiddle。）

【讨论】：

你的回答超出了我的问题。我不想使用 JavaScript，你也添加了 JQuery。很简单，我想要一个针对 JavaScript 被阻止的浏览器的倒计时重定向。
是的，但是这个答案可以满足您的要求，并使其适用于启用 JavaScript 和禁用 JavaScript 的浏览器。由于您的延迟实际上是 5 秒，并且其他答案没有显示正确的计数器，因此可能会让认为他/她的设备需要很长时间才能响应的用户感到沮丧；简而言之，这是一个 UI 反馈问题。那些不启用 JS 的人将看不到任何东西，但是现在大多数浏览器确实启用了 JS，因此您涵盖了大部分用例，同时最终保留了相同的行为。只是说。我将编辑答案以反映此评论。
您可以检查stackoverflow.com/a/25360351/3170029，它可以很好地满足我的所有要求，但会显示我不想要的所有秒，例如5,4,3,2,1 -> redirect。我只想确保该页面的访问者正常工作，而不是仅在中提供隐藏的重定向。
您指向的答案似乎在<head> 元素中输出内容，然后附加<meta>;这不起作用，因为浏览器不会在<head> 中呈现任何内容。如果将<meta> 附加到<body>，则它变为invalid HTML。此外，您选择为“可接受”的答案不会呈现任何内容，只会在重定向、启用 JavaScript 或不启用之前使页面“挂起”5 秒。我的回答涵盖所有情况。
我选择的答案是基于This can't be done only with php。我在上面评论中提到的休息已经过我和工作的测试。我在 `. 中添加了所有代码

【解决方案4】：

scusate per prima, ho postato male, sono ali inizi, sorry
<?php
echo "<pre>";
echo "Loading ...";
ob_flush();
flush();
$x = 21;
while($x >= 1) {
$x--;
echo '<br/>'. $x;
ob_flush();
flush();
sleep(1);
}
echo '<meta http-equiv="refresh" content="0;url=http://jsfiddle.net/">';

【讨论】：

本网站仅提供英文版。请通过editing您的帖子翻译并更正您的格式

【解决方案5】：

要做倒计时，所以它似乎有效还是我错了？

<?php
echo "Loading ...";
ob_flush();
flush();
$x = 21;
while($x >= 1) {
    $x--;
    echo '<br/>'. $x;
    ob_flush();
    flush();
    sleep(1);
}
echo '<meta http-equiv="refresh"content="0;url=http://jsfiddle.net/">';
?>`

【讨论】：