Показать перенаправление в .. Таймер обратного отсчета PHP - PullRequest
4 голосов
/ 02 января 2011

У меня есть этот код, который перенаправляет пользователя через 5 секунд на правильный URL:

<?php $url = $_GET['url']; header("refresh:5;url=$url"); include('ads.php'); ?>

Пожалуйста, не могли бы вы сказать мне, как я мог бы отобразить таймер обратного отсчета, говорящий о перенаправлении в ... с ... количеством оставшихся секунд. Я новичок в веб-разработке, поэтому весь код будет полезным!

Ответы [ 4 ]

17 голосов
/ 02 января 2011
<script type="text/javascript">

(function () {
    var timeLeft = 5,
        cinterval;

    var timeDec = function (){
        timeLeft--;
        document.getElementById('countdown').innerHTML = timeLeft;
        if(timeLeft === 0){
            clearInterval(cinterval);
        }
    };

    cinterval = setInterval(timeDec, 1000);
})();

</script>

Redirecting in <span id="countdown">5</span>.

Вы можете попробовать это.

5 голосов
/ 08 ноября 2012

Поскольку это распространенный вопрос для начинающих;Я просто хотел подчеркнуть, что для лучшей практики setInterval следует, а можно * обычно избегать , используя setTimeout рекурсивно внутри функции.

Например:

var timer = 5,
    el = document.getElementById('countdown');

(function t_minus() {
    'use strict';
    el.innerHTML = timer--;
    if (timer >= 0) {
        setTimeout(function () {
            t_minus();
        }, 1000);
    } else {
        // do stuff, countdown has finished.
    }
}());
0 голосов
/ 04 января 2013

Вот мое мнение, без переменных вне функции. Зависит от jQuery.

function count_down_to_action(seconds, do_action, elem_selector)
{
    seconds = typeof seconds !== 'undefined' ? seconds : 10;
    $(elem_selector).text(seconds)
    var interval_id = setInterval(function(){
        if (seconds <= 0)
        {
            clearInterval(interval_id);
            if (typeof do_action === 'function') 
                do_action();
        }
        else
            $(elem_selector).text(--seconds);
    },1000)
}

1004 *

Вот пример использования http://jsfiddle.net/VJT9d/

0 голосов
/ 16 июня 2012

Отличный код от Кайла.Я изменил таймер с помощью кнопки паузы и возобновления.

<HTML>
<HEAD>
    <SCRIPT LANGUAGE="JavaScript">

    var time_left = 50;
    var cinterval;
    var timestatus=1;

    function time_dec(){
        time_left--;
        document.getElementById('countdown').innerHTML = time_left;
        if(time_left == 0){
            clearInterval(cinterval);
        }
    }

    function resumetime()
    {
        //time_left = 50;
        clearInterval(cinterval);
        cinterval = setInterval('time_dec()', 1000);
    }

    function defaultstart()
    {
        time_left = 50;
        clearInterval(cinterval);
        cinterval = setInterval('time_dec()', 1000);
    }

    function stopstarttime()
    {
        if(timestatus==1)
    {
        clearInterval(cinterval);
        document.getElementById('stopbutton').value="Start";
        timestatus=0;
    }
        else
    {
        clearInterval(cinterval);
        cinterval = setInterval('time_dec()', 1000);
        document.getElementById('stopbutton').value="Stop";
        timestatus=1;
    }
    }

    defaultstart();

    </SCRIPT>
</HEAD>

<body>
    Redirecting In <span id="countdown">50</span>.
    <INPUT TYPE="button" value="stop" id="stopbutton" onclick="stopstarttime()">
</body>
</HTML>
...