网页出四则运算题目

成品链接：

点我进入系统！

 

 

 

上代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            #div1{
                border: 1px solid red;
                background-color: #F5F5F5;
                width: 100%;
                height: 190px;
                text-align: center;
                clear: both;
            }
            #div2{
                border: 1px solid red;
                background-color: #F5F5F5;
                width: 100%;
                height: 100%;
            }
        </style>
        <script src="jquery-1.8.3.js"></script>
        <script>
            $(document).ready(function(){
                tm = 0;
                jg=new Array();
                a= new Array();
                b= new Array();
                c= new Array();
                j=0;
                xs = 1;
                $("#btn").click(function(){
                    if(xs==1){
                        $("#div2").toggle();
                        xs=0;
                    }
                    if(tm==1){
                        $("#locatin").empty();
                    }
                    n = document.getElementById("nt").value;
                    nh = document.getElementById("nht").value;
                    if(nh>10){
                        kuan = 100+(nh-10)*10;
                        $("#div1")[0].style.width=kuan+"%";
                        $("#div2")[0].style.width=kuan+"%";
                    }
                    for(i=0;i<n;i++){
                            chuti();
                                
                                // while(true){
                                //     alert("666");
                                //     for(cha=0;cha<=j;cha++){
                                //         if(a[cha]==x&&b[cha]==y&&c[cha]=fh){
                                //             chuti();
                                //             break;
                                //         }
                                // }
                                //     if(cha==j+1){
                                //         break;
                                //     }
                                // }
                            a[j]=x;
                            b[j]=y;
                            c[j]=fh;
                            j++;
                            if(fh==0){
                                fuhao = "+";
                                jg[i]=x+y;
                            }
                            else if(fh==1){
                                fuhao = "-";
                                jg[i]=x-y;
                            }
                            else if(fh==2){
                                fuhao = "*";
                                jg[i]=x*y;
                            }
                            if(fh==3){
                                fuhao = "/";
                                jg[i]=x/y;
                            }
                            $("#locatin").append("<td width='200px'>"+(i+1)+":"+x+fuhao+y+"="+"<input type='text' name='jieguo' size='2'/>"+"</td>");
                    if((i+1)%nh==0){
                        $("#locatin").append("<br />");
                    }
                    tm = 1;
                    }
                });
                
            $("#pd").click(function(){
                sjg = new Array();
                $("input[name='jieguo']").each(function(temp,item){
                    sjg[temp]=item.value;
                    // $("#locatin").append(item.value+"<br />");
                });
                for(i=0;i<n;i++){
                    if(sjg[i]==jg[i]){
                        $("#locatin").append("第"+(i+1)+"题正确！"+"<br />")
                    }
                    else{
                        $("#locatin").append("第"+(i+1)+"题错误！正确答案为:"+jg[i]+"<br />")
                    }
                }
            });    
            });
            function chuti(){
                x = parseInt(99*Math.random()+1);
                y = parseInt(99*Math.random()+1);
                fh =parseInt(4*Math.random());
                if(fh==1||fh==3)
                        {
                            while(x<y)
                            {
                                 x = parseInt(99*Math.random()+1);
                                 y = parseInt(99*Math.random()+1);    
                            }
                        }
                if(fh==2)
                        {
                            
                            while(x*y>100)
                            {
                                 x = parseInt(99*Math.random()+1);
                                 y = parseInt(99*Math.random()+1);    
                            }
                        }
                if(fh==3)
                        {
                            while(x%y!=0)
                            {
                                x = parseInt(99*Math.random()+1);
                                y = parseInt(99*Math.random()+1);
                            }
                        }
            }
        </script>
    </head>
    <body>
        <div id="div1">
            <p style="color: #FF0000; font-size: larger;">&nbsp;&nbsp;&nbsp;&nbsp;小学生四则运算自动出题系统</p>
            <p>&nbsp;&nbsp;&nbsp;请输入出题数:<input type="text" id="nt"></p>
            <p> 请输入每行题数:<input type="text" id="nht"></p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" id="btn" value="点我出题"/> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="button" id="pd" value="点我判断正误" />
        </div>
        <div id="div2" style="display: none;">
            <p id="locatin"></p>
        </div>
    </body>
</html>

 

posted @ 2019-10-14 20:14  Nevesettle  阅读(206)  评论(0)    收藏  举报