javascript - 倒计时 JavaScript

标签 javascript php html mysql countdown

最近我正在做电子图书馆的项目,需要为用户阅读的每本书提供倒计时器。

例如,在我的数据库中,“用户”有“100 秒”的信用时间来阅读这本书,并且只有当他们阅读这本书时,时间才会减少。

这是我的代码:

<?php
        require_once('DatabaseManager.php');
        $databaseManager = new DatabaseManager();
        $books = $databaseManager->getAllRows('books');
        while ($book = mysqli_fetch_assoc($books)) {
            $_SESSION['timer1'] = $book['timer'];
        }
        ?>
         <html>
<head>
<title>Countdown</title>

    <script>
    var clicked = false;
    var sec = <?php echo $_SESSION['timer1'];?>;

    function startClock() {
        if (clicked === false) {
            clock = setInterval("stopWatch()", 1000);
            clicked = true;
        }
        else if (clicked === true) {
        }
    }

    function stopWatch() {
        sec--;
        document.getElementById("timer").innerHTML = sec;


    }

    function updateValue() {
        <?php 
        $time_update = $databaseManager->editRow('books', 'book_id', '1', 'timer', $_GET['REMAINING VALUE FROM COUNTDOWN STORED HERE'] );
        ?>
    }
    </script>
</head>
<body>

    <input type="submit" id="start-clock" value="Start" name="submit" onClick="startClock()"/>

    <div id="timer">0</div>
    <input type="submit" id="stop-clock" value="Stop" name="submit" onClick="updateValue()"/>
    </br>

</body>
</html>

所以我想做的是:当用户有100秒的信用值并且他们只读取了45秒时,剩余的55秒值将自动存储到数据库中。使用“updateValue()”

另一件事是我尝试使用 onClick 按钮并且它正在工作,但我希望每当用户关闭浏览器时此代码都可以工作。

提前感谢您。

最佳答案

您可以执行以下操作:

当用户阅读书籍时,每“n”秒向您的服务器发送一条消息(AJAX)。服务器收到消息后会从该用户的图书阅读时间的剩余时间中减少“n”秒,并将该时间发回。

网页收到剩余时间值后,如果收到的值为零或负数,将重定向到另一个页面。

这样您就能够跟踪剩余时间,最大误差为“n”秒。

关于javascript - 倒计时 JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22012629/

相关文章:

PHP静态成员继承

php - php/mysql 更新新手

php - Javascript HTML 按钮点击不起作用

javascript - 如何在 Chrome 调试器中调试 ajax 调用后从服务器返回的 javascript

javascript - 这个 require() 语句是什么意思?

javascript - 使并排图像在移动设备上移动为垂直图像

python - 如何将 docutils 文档树转换为 HTML 字符串?

javascript - 根据用户屏幕尺寸更改元素的位置。如何为移动设备堆叠这些元素?

php - 从 mysql 回显更多行

javascript - 如何链接返回代码 302 的外部 js 文件