Question

我正在创造时间，我将用它来制作倒数计时器。当我选择JavaScript或jQuery时，很容易创建。但问题来自于我获得PHP日期时间字符串并使用jQuery显示它。使用PHP日期和时间字符串后，它不会动态更新时间。以下是我的一些代码。

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>

    $(document).ready(function(){
        var value = $("#date_time").text();

        function countdown(){
              setTimeout(countdown, 1000);
              var date = new Date(Date.parse(value));
              $("#php_date_time").text(date);

           }
        countdown();


    });



    </script>
</head>
<body >
    <div id="date_time"><?php echo Date("d-m-Y H:i:s");?></div>
    <div id="php_date_time"> </div>

</body>
</html>

如果我没有将PHP日期时间字符串作为参数传递给javascript Date()函数，则代码可以正常工作。如果开始工作，我可以自己倒计时。

var date = new Date(); // works fine without passing php date time string
var date = new Date(Date.parse(value)); // this does not work fine. Time does not update

请帮忙建议我需要做什么。

感谢。

Answer 1

问题是服务器只编译一次你的php日期，你的countdown函数总是使用相同的日期值。还有另一个问题，你必须考虑哪个是你的服务器时间不必与客户端时间匹配。你最好用客户时间开始你的计时器。但是如果你想根据你的服务器时间启动它，试试这个，你的问题就解决了：

$(document).ready(function(){
    var value = $("#date_time").text();

    function countdown(date){
        setTimeout(function(){
            countdown(new Date(date.valueOf()+1000));
        }, 1000);

        $("#php_date_time").text(date);
    }

    countdown(new Date(Date.parse(value)));
});

Answer 2

由于您希望它从PHP提供的时间开始，您需要更改您的javascript以使用该时间来设置初始值，然后每秒更改一次。现在你只是用相同的值进行更新。

http://codepad.viper-7.com/sPVlEI

$(document).ready(function(){
    var value = $("#date_time").text();   //get init value
    var date = new Date(Date.parse(value)); //store initial time

    setInterval(function countdown(){
        $("#php_date_time").text(date);    //set time
        date = new Date(date.getTime() + 1000);  //create new time from old + 1 sec
    },1000); // will call countdown() function every second

});

将PHP时间字符串用于javascript后，倒计时无效

2 个答案: