Question

代码：

<html>
    <head>
        <title>Timer</title>
    </head>
<body>
    <?php
        $dbSessionDuration = "1:30:00";
        list($hour,$min,$sec) = explode(':', $dbSessionDuration);
        $dbSessionDurationTime = mktime(0,0,0,$hour,$min,$sec);
    ?>
    <div class="count"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        var millis = <?php echo $dbSessionDurationTime; ?>
        function displaytimer(){
            var hours = Math.floor(millis / 36e5),
                mins = Math.floor((millis % 36e5) / 6e4),
                secs = Math.floor((millis % 6e4) / 1000);
                $('.count').html(hours+':'+mins+':'+secs);  
        }
        setInterval(function(){
            millis -= 1000;
            displaytimer();
        }, 1000);
    </script>
</body>
</html>

在这段代码中，我想创建一个计时器，时间将在1:30:00之后开始，然后像1:29:59然后1:29:58这样减少秒数，但是现在当我用来获取class="count"内部的时间不会发生。不知道为什么那么，如何解决此问题？请帮助我。

谢谢

Answer 1

问题出在您的转换上，它返回949219200，实际上它应该返回5400000

<html>
    <head>
        <title>Timer</title>
    </head>
<body>
    <?php
      $dbSessionDuration = "1:30:00";

      $time   = explode(":", $dbSessionDuration);

      $hour   = $time[0] * 60 * 60 * 1000;
      $minute = $time[1] * 60 * 1000;
      $sec    = $time[2] * 1000;

      $dbSessionDurationTime = $hour + $minute + $sec;

    ?>
    <div class="count"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        var millis = '<?php echo $dbSessionDurationTime; ?>';
        function displaytimer(){
            var hours = Math.floor(millis / 36e5),
                mins = Math.floor((millis % 36e5) / 6e4),
                secs = Math.floor((millis % 6e4) / 1000);
                $('.count').html(hours+':'+mins+':'+secs);  
        }
        setInterval(function(){
            millis -= 1000;
            displaytimer();
        }, 1000);
    </script>
</body>

现在$dbSessionDurationTime将包含正确数量的5400000毫秒数，这是一个有效的codepen：https://codepen.io/anon/pen/EpGYKo当然不存在php部分，但是您可以看到计时器以您想要它。

Answer 2

您的代码有两个注释：-

-如果要将变量从php转换为javascript，则应在双引号或单引号内回显它。

-您需要在millis中获取总时间，因为您正在使用此millis重新生成时间，因此这是将时间转换为毫秒( ( intval($hour) * 60 * 60 ) + ( intval($min) * 60 ) + ( intval($sec) ) ) * 1000的等式。

代码

<html>
<head>
    <title>Timer</title>
</head>
<body>
    <?php
        $dbSessionDuration = "1:30:00";
        list($hour,$min,$sec) = explode(':', $dbSessionDuration);
        $dbSessionDurationTime =  ( ( intval($hour) * 60 * 60 ) + ( intval($min) * 60 ) + ( intval($sec) ) ) * 1000;
    ?>
    <div class="count"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
    </script>
    <script type="text/javascript">
        var millis = '<?php echo $dbSessionDurationTime; ?>';
        function displaytimer(){
            var hours = Math.floor(millis / 36e5),
                mins = Math.floor((millis % 36e5) / 6e4),
            secs = Math.floor((millis % 6e4) / 1000);
            $('.count').html(hours+':'+mins+':'+secs);  
        }
        setInterval(function(){
            millis -= 1000;
            displaytimer();
        }, 1000);
    </script>
</body>
</html>

如何使用php显示计时器？

2 个答案: