软件工程第一个小例子

Posted 2020-06-19

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了软件工程第一个小例子相关的知识，希望对你有一定的参考价值。

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 class="res2">?</span>‘);
          }else{
            if(mark == ‘+‘){
              rightRes = parseInt(valueA)+parseInt(valueB);
            }else{
              rightRes = parseInt(valueA)-parseInt(valueB);
            }
            if(res == rightRes){
              yes++;
              $(this).append(‘<span class="res1">?</span>‘);
            }else{
              no++;
              $(this).append(‘<span class="res2">?</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>

以上是关于软件工程第一个小例子的主要内容，如果未能解决你的问题，请参考以下文章

分享几个实用的代码片段（附代码例子）

微信小程序代码片段

Sphinx、reStructuredText 显示/隐藏代码片段

微信小程序第七天WXML语法之模板用法

软件工程 第一个小例子

软件工程第一个小例子