成品链接:
上代码:
<!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;"> 小学生四则运算自动出题系统</p> <p> 请输入出题数:<input type="text" id="nt"></p> <p> 请输入每行题数:<input type="text" id="nht"></p> <input type="button" id="btn" value="点我出题"/> <input type="button" id="pd" value="点我判断正误" /> </div> <div id="div2" style="display: none;"> <p id="locatin"></p> </div> </body> </html>