用JavaScript做一个web答题系统

最新推荐文章于 2024-02-05 17:45:00 发布

有品位的程序员

最新推荐文章于 2024-02-05 17:45:00 发布

阅读量5.3k

点赞数 3

分类专栏： HTML5/CSS3 JavaScript 文章标签： js html web javascript css

本文链接：https://blog.csdn.net/The_Handsome_Sir/article/details/106553831

版权

HTML5/CSS3 同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

JavaScript

14 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<script>
    var t = 180;
    function time(){
        document.getElementById("begin").style.display="none";
        if(t>=0){
            setTimeout(function(){
                document.getElementById("clock").innerHTML = t;
                t--;
                time();
            },1000);
        }
    }
    function display() {
        document.getElementById("one").style.display="block";
    }
    function judge1(){
        var str = document.getElementById("judge1").value;
        if(str=="")
            alert("用户输入不能为空");
        else if(str!="2")
            alert("答案不正确");
        else{
            document.getElementById("one").style.display="none";
            document.getElementById("two").style.display="block";
        }
    }
    function judge2(){
        var str = document.getElementById("judge2").value;
        if(str=="")
            alert("用户输入不能为空");
        else if(str!="4")
            alert("答案不正确");
        else{
            document.getElementById("two").style.display="none";
            document.getElementById("three").style.display="block";
        }
    }
    function judge3(){
        var str = document.getElementById("judge3").value;
        if(str=="")
            alert("用户输入不能为空");
        else if(str!="6")
            alert("答案不正确");
        else{
            alert("恭喜用户过关");
            t=-2;
            document.getElementById("clock").style.display="none";
        }
    }
</script>
Web答题系统
<h1 id="clock"></h1>
<div id="begin" style="display:block"><input type="button" value="倒计时开始" onclick="time();display()"></div>
<div id="one" style="display:none">
    1+1=?<br/>
    请输入答案:<input id="judge1" type="text"/><br/>
    <input type="button" value="提交" onclick="judge1()"/>
</div>
<div id="two" style="display:none">
    2+2=？<br/>
    请输入答案:<input id="judge2" type="text"/><br/>
    <input type="button" value="提交" onclick="judge2()"/>
</div>
<div id="three" style="display:none">
    3+3=?<br/>
    请输入答案:<input id="judge3" type="text"/><br/>
    <input type="button" value="提交" onclick="judge3()"/>
</div>
</body>
</html>

效果
在这里插入图片描述

有品位的程序员

关注

3
点赞
踩
45

收藏

觉得还不错? 一键收藏
0
评论
用JavaScript做一个web答题系统

<!DOCTYPE html><html><head> <meta charset="utf-8"></head><body><script> var t = 180; function time(){ document.getElementById("begin").style.display="none"; if(t>=0){
复制链接

扫一扫

专栏目录