如何在jQuery中制作一个乘法表

时间:2018-07-16 17:57:52

标签: javascript jquery html

对于使用jquery还是一个初学者来说,它仍然是一个初学者,我知道这是一个大问题,因为它仍然存在错误,并且要完成很多代码才能使它工作,所以我需要就是将两个数字相加,相减,相乘和相除,然后按运算符时,第一个被按压的数字将不会消失,相反,在按下第二个数字后它将消失并被更改。如果你们都可以帮助我解决我的问题,那也将非常感谢。非常感谢。

$(document).ready(function() {
  var number = "";
  $(".numeric").click(function() {
    var num = $(this).val();
    number = number + "" + num;
    $("#container").val(number);
  });

  $(".clear").click(function() {
    $("#container").val("");
    number = "";
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!DOCTYPE html>
<html>

<head>
  <title>Sample Calculator</title>
</head>

<body>
  <input type="text" id="container" placeholder="" readOnly="readOnly" />
  <br /><br />
  <table border="1" cellpadding="3">
    <tbody>
      <tr>
        <td>
          <input type="button" class="numeric" value="7" />
        </td>
        <td>
          <input type="button" class="numeric" value="8" />
        </td>
        <td>
          <input type="button" class="numeric" value="9" />
        </td>
        <td>
          <input type="button" class="operation" value="+" />
        </td>
      </tr>
      <tr>
        <td>
          <input type="button" class="numeric" value="4" />
        </td>
        <td>
          <input type="button" class="numeric" value="5" />
        </td>
        <td>
          <input type="button" class="numeric" value="6" />
        </td>
        <td>
          <input type="button" class="operation" value="-" />
        </td>
      </tr>
      <tr>
        <td>
          <input type="button" class="numeric" value="1" />
        </td>
        <td>
          <input type="button" class="numeric" value="2" />
        </td>
        <td>
          <input type="button" class="numeric" value="3" />
        </td>
        <td>
          <input type="button" class="operation" value="*" />
        </td>
      </tr>
      <tr>
        <td>
          <input type="button" class="numeric" value="0" />
        </td>
        <td>
          <input type="button" class="operation" value="=" />
        </td>
        <td>
          <input type="button" class="operation" value="/" />
        </td>
        <td>
          <input type="button" class="clear" value="Clear" />
        </td>
      </tr>
    </tbody>
  </table>
</body>

</html>

0 个答案:

没有答案