你的位置:首页 > Java教程

[Java教程]软件工程 第一个小例子


1.生成加减号:

  Math.floor(Math.random()*2)随机产生数字1或2,用1表示+,2表示-

2.随机产生两个数:

  Math.floor(Math.random()*range),range表示范围

  因为是小学简单数学,所以结果不能为负数,这就需要做减法是第二个数比第一个数小

3.访问链接   运行效果

4.具体代码如下:

javascript

<script type="text/javascript" >  $(function(){   $('input').keydown(function(event){    if(event.keyCode!=8 && (event.keyCode<48 || event.keyCode>57)){     return false;    }   });   $('#create').click(function(){    var num = $('#num').val();    var range = $('#range').val();    if(num == ''){     alert('请填写题目数量!');     return false;    }    if(range == ''){     alert('请填写出题范围!');     return false;    }    $("#createDiv").css('display','none');    for(var i=0;i<num;i++){     var mark = Math.floor(Math.random()*2);     var valueA = Math.floor(Math.random()*range);     if(mark==0){      mark='+';      var valueB = Math.floor(Math.random()*range);     }else{      mark='-';      var valueB = Math.floor(Math.random()*parseInt(valueA));     }     var html = "<div class='question'><span class='span'>"+(i+1)+".</span><span class='span1'>"+valueA+"</span><span class='span2'>"+mark+"</span><span class='span3'>"+valueB+"</span><span class='span4'>=</span><input type='text' class='input'></div>";     $('#div').append(html);    }    $('input').keydown(function(event){     if(event.keyCode!=8 && (event.keyCode<48 || event.keyCode>57)){      return false;     }    });    $('#submit').css('display','block');   });   $('#submit').click(function(){    var yes = 0;     var no = 0;    $(this).css('display','none');    $('.question').each(function(){     $(this).find('input').attr('disabled',true);     var valueA = $(this).find('.span1').html();     var mark = $(this).find('.span2').html();     var valueB = $(this).find('.span3').html();     var res = $(this).find('input').val();     var rightRes=0; //输入结果     if(res == ''){      no++;      $(this).append('<span >✘</span>');     }else{      if(mark == '+'){       rightRes = parseInt(valueA)+parseInt(valueB);      }else{       rightRes = parseInt(valueA)-parseInt(valueB);      }      if(res == rightRes){       yes++;       $(this).append('<span >✔</span>');      }else{       no++;       $(this).append('<span >✘</span>');      }     }    });    alert('正确'+yes+'道题,错误'+no+'道题。');    $('#div').append('正确'+yes+'道题,错误'+no+'道题。');   });  }); </script>

css

<style type="text/css">  .span{  margin:0 10px;  width:50px;  display:inline-block;  text-align: center; } .span1,.span3{  margin:0 5px;width:50px;  display:inline-block;text-align: center; } .span2,.span4{  margin:0 5px;width:20px;  display:inline-block;text-align: center; } .question{  width:500px;  height:30px;  margin:2px; } .question input{  margin:0 5px;text-align: center;width:100px; } #submit{  display:none; } #div1{  width:500px;  margin:0 auto; } .res1{  color:#56D003; } .res2{  color:#F10100; } </style>

html

<body> <div id="div1">  <div id="div">  </div>  <button id="submit">提交</button>  <div id="createDiv">   <table>    <tr>     <td>题目数量:</td>     <td><input type="text" id="num" class="input"></td>    </tr>    <tr>     <td>题目范围:</td>     <td><input type="text" id="range" class="input"></td>    </tr>   </table>   <button id="create">出题</button>  </div> </div></body>