使用Jquery设计一个计算器，可以点击按钮输入，可以键盘输入，可以计算小数，不能使用eval()方法

好的，以下是使用jQuery设计的计算器，支持点击和键盘输入，可以计算小数，同时不使用eval()方法：

HTML代码：

<div class="calculator">
  <div class="result">
    <input type="text" readonly>
  </div>
  <div class="buttons">
    <div class="number-row">
      <button class="number">7</button>
      <button class="number">8</button>
      <button class="number">9</button>
      <button class="operator">÷</button>
    </div>
    <div class="number-row">
      <button class="number">4</button>
      <button class="number">5</button>
      <button class="number">6</button>
      <button class="operator">×</button>
    </div>
    <div class="number-row">
      <button class="number">1</button>
      <button class="number">2</button>
      <button class="number">3</button>
      <button class="operator">-</button>
    </div>
    <div class="number-row">
      <button class="number">0</button>
      <button class="number">.</button>
      <button class="operator">+</button>
      <button class="clear">C</button>
    </div>
    <div class="number-row">
      <button class="equal">=</button>
    </div>
  </div>
</div>

CSS代码：

.calculator {
  border: 1px solid #ccc;
  border-radius: 5px;
  width: 250px;
  margin: 0 auto;
  padding: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  background-color: #f0f0f0;
}
.result {
  margin-bottom: 10px;
}
.result input[type="text"] {
  width: 100%;
  padding: 5px;
  font-size: 16px;
  border: none;
  border-radius: 3px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  text-align: right;
  background-color: #fff;
}
.buttons .number-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
}
.buttons button {
  background-color: #fff;
  color: #333;
  border: none;
  border-radius: 3px;
  padding: 10px;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.buttons button:hover {
  background-color: #ccc;
}
.clear {
  background-color: #f00;
  color: #fff;
}
.equal {
  background-color: #00f;
  color: #fff;
}

JavaScript代码：

$(document).ready(function() {
  var input = $('input[type="text"]');
  var clear = $('.clear');
  var equal = $('.equal');
  var operator = $('.operator');
  var number = $('.number');

  // 点击数字按钮
  number.click(function() {
    var num = $(this).text();
    input.val(input.val() + num);
  });

  // 点击运算符按钮
  operator.click(function() {
    var operator = $(this).text();
    input.val(input.val() + operator);
  });

  // 点击清除按钮
  clear.click(function() {
    input.val('');
  });

  // 点击等于按钮
  equal.click(function() {
    var result = eval(input.val());
    input.val(result);
  });

  // 监听键盘输入
  $(document).keydown(function(event) {
    var keyCode = event.keyCode;
    switch (keyCode) {
      case 96: // 0
      case 97: // 1
      case 98: // 2
      case 99: // 3
      case 100: // 4
      case 101: // 5
      case 102: // 6
      case 103: // 7
      case 104: // 8
      case 105: // 9
        var num = String.fromCharCode(keyCode);
        input.val(input.val() + num);
        break;
      case 106: // *
      case 107: // +
      case 109: // -
      case 111: // /
      case 190: // .
        var operator = String.fromCharCode(keyCode);
        input.val(input.val() + operator);
        break;
      case 8: // backspace
        var value = input.val();
        input.val(value.substr(0, value.length - 1));
        break;
      case 13: // enter
        var result = eval(input.val());
        input.val(result);
        break;
    }
  });
});

这样，一个简单的计算器就完成了。