本地主机事件在双击和三击时意外触发

Question

当我慢慢点击“1”，然后再点击“1”时，我得到“11”。但双击输出3个字符。快速三击给我5甚至更多。这只发生在我的localhost上。我尝试过jQuery方法：.unbind()，.off()，.on()，.one()。

出了什么问题？

$(document).ready(function() {
  
  var $display = $("#display");

  var x = {};
  var stringToObjectCall = null;
  var buttonID = "";
  var expression = "";

  $('.btnClick').unbind('click').click(function() {

    buttonID = ($(this).find('span')).attr('id');
    number = ($(this).find('span').text());
    console.log(number);

    switch (buttonID) {

      case "clc":
        clc();
        break;
      case "ce":
        ce();
        break;
      case "divide":
        divide();
        break;
      case "multiple":
        multiple();
        break;
      case "minus":
        minus();
        break;
      case "plus":
        plus();
        break;
      case "equal-sign":
        equal();
        break;
      case "dot":
        dot();
        break;
      default:
        calc(number);
        break;
    }

  });

  function calc(numb) {
    expression += numb;
    $display.html(expression);
    console.log(expression);
  }

  function clc() {
    expression = "";
    $display.html(expression);
    console.log("clc");
  }

  function ce() {
    expression = expression.substring(0, expression.length - 1);
    $display.html(expression);
    console.log("ce");
  }

  function divide() {
    expression += "/";
    $display.html(expression);
    console.log("divide");
  }

  function multiple() {
    expression += "*";
    $display.html(expression);
    console.log("multiple");
  }

  function minus() {
    expression += "-";
    $display.html(expression);
    console.log("minus");
  }

  function plus() {
    expression += "+";
    $display.html(expression);
    console.log('plus');
  }

  function equal() {
    if (!expression) {
      return;
    }
    try {

      $display.html(parseFloat((eval(expression)).toFixed(5)));
      console.log("equal");
      
    } catch (e) {
      $display.html("Syntax ERROR");
    }
  }

  function dot() {
    expression += ".";
    $display.html(expression);
    console.log("dot");
  }
});

html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
  font-size: 20px;
}
#janusz {
  background: #03A9F4;
}
.calculator-buttons {
  width: 300px;
  margin: 0 auto;
}
.button {
  line-height: 75px;
  width: 75px;
  height: 75px;
}
.button:hover {
  cursor: pointer;
}
.small-container {
  height: 25%;
}
.float-left {
  float: left;
  width: 75%;
}
.float-right {
  float: right;
}
.bottom-container {
  height: 100%;
  width: 75%;
}
.bottom-container > div {
  height: 75px;
  float: left;
  width: 33.3%;
}
#equal {
  height: 150px;
  width: 25%;
  line-height: 150px;
}
.zero-sign {
  width: 66.66% !important;
}
.display {
  height: 75px;
  line-height: 75px;
  margin-top: 20px;
}
html {
  background-color: #BDBDBD;
}
.default-primary-color {
  background: #0288D1;
}
.dark-primary-color {
  background: #03A9F4;
}
.light-primary-color {
  background: #B3E5FC;
}
.text-primary-color {
  color: #FFFFFF;
}
.accent-color {
  background: #fb7676;
}
.primary-text-color {
  color: #212121;
}
.secondary-text-color {
  color: #757575;
}
.divider-color {
  border-color: #BDBDBD;
}
.unselectable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>

<div class="container primary-text-color unselectable">
  <!--   <div class="center" id="clc" style="cursor: pointer;" >CLC</div> -->
  <div class="row">
    <div class="calculator-buttons flow-text">
      <div class="col l12 m12 s12 display default-primary-color text-primary-color right-align" id="display"></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center ac-ce accent-color"><span id="clc">AC</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center ac-ce accent-color"><span id="ce">CE</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="divide">/</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="multiple">X</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="seven">7</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="eight">8</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="nine">9</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="minus">-</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="four">4</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="five">5</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="six">6</span></div>
      <div class="waves-effect col l3 m3 s3 button btnClick center default-primary-color"><span id="plus">+</span></div>
      <div class="small-container">
        <div class="bottom-container float-left">
          <div class="waves-effect button btnClick center default-primary-color"><span id="one">1</span></div>
          <div class="waves-effect button btnClick center default-primary-color"><span id="two">2</span></div>
          <div class="waves-effect button btnClick center default-primary-color"><span id="three">3</span></div>
          <div class="waves-effect button btnClick center default-primary-color zero-sign"><span id="zero">0</span></div>
          <div class="waves-effect button btnClick center default-primary-color"><span id="dot">.</span></div>
        </div>
        <div class="waves-effect button btnClick center float-right dark-primary-color" id="equal"><span id="equal-sign">=</span></div>
      </div>
    </div>
  </div>
</div>

View on JSFiddle