页面计时器

最新推荐文章于 2024-04-09 14:07:34 发布

杨撒撒

最新推荐文章于 2024-04-09 14:07:34 发布

阅读量2k

点赞数 2

分类专栏：前端随笔

本文链接：https://blog.csdn.net/yls0115/article/details/91419508

版权

前端随笔专栏收录该内容

6 篇文章 0 订阅

订阅专栏

由于考试系统的需要，完成一个在线练习的计时，计算考生需要花费多长时间完成练习。
效果图：
在这里插入图片描述
我是在页面进行操作的，单纯的想完成效果的可以借鉴，小女子不才！
页面代码部分：


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>网上考试 - 实验室安全考试系统</title>
    <link href="/template/lib/css/cg.min.css" rel="stylesheet" type="text/css" />
    <link href="/template/css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/template/lib/js/jquery.min.js"></script>
</head>

<body>
<div class="w-990">

    <div class="shiti-content">

        <div class="title">在线测试</div>
        <div class="shuoming">
            <ul>

                <li>guest，你正在进行在线测试，已用时间：<span id="_lefttime"></span></li>
                <li>完成后请点击页面右下角的按钮提交答卷。</li>
            </ul>
        </div>


    </div>

</div>
    <div class="clear"></div>

</div>

<script type="text/javascript" src="/template/lib/js/cg.min.js"></script>

<SCRIPT LANGUAGE="JavaScript">
    var secondsInit = 0;

    function _fresh()
    {
        secondsInit ++;
        var seconds = secondsInit;
        var result = '';
        if (seconds >= 3600)
        {
            var h = Math.floor(seconds / 3600);
            result += h + "小时";
            seconds -= 3600 * h;
        }
        if (seconds >= 60)
        {
            var m = Math.floor(seconds / 60);
            result += m + "分";
            seconds -= 60 * m;
        }
        result += seconds + "秒";
        document.getElementById('_lefttime').innerHTML = result;
    }
    _fresh()
    setInterval(_fresh,1000);

</SCRIPT>

</body>
</html>

其实我也是借鉴别人的，但是自己总结出来，这样方便大家看，也方便自己日后用。

杨撒撒

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
页面计时器

由于考试系统的需要，完成一个在线练习的计时，计算考生需要花费多长时间完成练习。效果图：我是在页面进行操作的，单纯的想完成效果的可以借鉴，小女子不才！页面代码部分：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit...
复制链接

扫一扫