zxksxt/templates/exam.html

<!-- extends表明此页面继承自 base.html 文件 -->
{% extends "base.html" %}
{% load static %}

<!-- 写入 base.html 中定义的 title -->
{% block title %}
在线考试系统
{% endblock title %}

<!-- 写入 base.html 中定义的 content -->
{% block content %}

<div class="container">
    <div class="row">
        <p class="col-12 mt-4 mb-4">
            <a>当前科目:{{ subject }}</a>
            <a>当前考试用户：{{ student.name }}</a>
            考试时长：
            <b class="alt-1"> 01:40 </b>
        </p>
    </div>
        <div class="container">
        <form action="/calculateGrade/" method="post">
            <input type="hidden" name="sid" value="{{ student.sid }}">
            <input type="hidden" name="subject" value="{{ subject }}">
            <div class="row">
                <b class="bi bi-alarm" id="timer" style="color:red"></b>
                <p>&emsp;</p>
                <font><input type="submit" name="tijiao" value="交卷"></font>
            </div>
            <div class="row">
                <div class="col-12 mt-4 mb-4">
                    <h2>单选题</h2>
                    <p>
                        <span>共</span><i class="content_lit">10</i><span>题，</span>
                        <span>合计</span><i class="content_fs">10</i><span>分</span>
                    </p>
                </div>
            </div>
            <div class="container">
            {% for paper1 in paper %}
            {% for test in paper1.pid.all %}
            <div class="row bg-light">
                <div class="col-12">
<!--                <div class="card">-->
<!--                    <div class="card-body h-10">-->
                        <div id="{{ forloop.counter }}">
                                <b>{{ forloop.counter}}.</b><span>({{ test.score }}分)</span>
                                <b>{{ test.title }}</b>
                                <ul>
                                    <li class="option">
                                        <input type="radio" class="radioOrCheck" name="{{ test.id }}"
                                               value="A"/>
                                        <label>A.
                                            <p class="ue" style="display: inline;">{{ test.a }}</p>
                                        </label>
                                    </li>
                                    <li class="option">
                                        <input type="radio" class="radioOrCheck" name="{{ test.id }}"
                                               value="B"/>
                                        <label>
                                            B.<p class="ue" style="display: inline;">{{ test.b }}</p>
                                        </label>
                                    </li>
                                    <li class="option">
                                        <input type="radio" class="radioOrCheck" name="{{ test.id }}"
                                               value="C"/>
                                        <label>
                                            C.<p class="ue" style="display: inline;">{{ test.c}}</p>
                                        </label>
                                    </li>
                                    <li class="option">
                                        <input type="radio" class="radioOrCheck" name="{{ test.id }}"
                                               value="D"/>
                                        <label>
                                            D.<p class="ue" style="display: inline;">{{ test.d }}</p>
                                        </label>
                                    </li>
                                </ul>
<!--                        </div>-->
<!--                    </div>-->
                    </div>
                </div>
            </div>
                {% endfor %}
                {% endfor %}
            </div>
        </form>
    </div>
        <!--nr end-->
        <div class="foot"></div>
</div>

<SCRIPT type="text/javascript">
            var maxtime = 1000; //一个小时，按秒计算，自己调整!
            $(function () {
                timer = setInterval("CountDown()", 1000);
            })
                function CountDown() {
                    if (maxtime >= 0) {
                        minutes = Math.floor(maxtime / 60);
                        seconds = Math.floor(maxtime % 60);
                        msg = "距离结束还有" + minutes + "分" + seconds + "秒";
                        {#document.all["timer"].innerHTML = msg;#}
                        document.getElementById('timer').innerHTML = msg;
                        {#if (maxtime == 5 * 60)alert("还剩5分钟");#}
                            --maxtime;
                    } else{
                        {#clearInterval(timer);#}
                        {#alert("时间到，结束!");#}
                        document.getElementsByClassName('tijiao').click();
                    }
                }

</SCRIPT>

{% endblock content %}