javascript - 文本框仅允许小数、删除和退格

Question

我有一个适用于十进制数的代码，只允许小数点后两位数字。我的问题是如何将代码修改为:

1. 允许退格和删除并且
2. 如何使代码动态化，以便不使用 id 属性，而是在 html 上的方法中传递元素，并在 javascript 中接受和使用该元素/jquery.

这是我的代码:

function isNumberKey(evt, element) {
  var charCode = (evt.which) ? evt.which : event.keyCode
  if (charCode > 31 && (charCode < 48 || charCode > 57))
    return false;
  else {
    var len = $('#rate').val().length;
    var index = $('#rate').val().indexOf('.');

    if (index > 0 && charCode == 46) {
      return false;
    }
    if (index > 0) {
      var CharAfterdot = (len + 1) - index;
      if (CharAfterdot > 3) {
        return false;
      }
    }

  }
  return true;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" class="form-control" id="rate" name="rate" placeholder="Billing Rate" required onkeypress="return isNumberKey(event,this)">

Answer 1

我找到了解决方案。为任何与我有相同需求的人添加代码。

/*
 *  Function to allow decimal numbers to be entered in the text box
 *   - allows integers, backspace and delete
 *   - does not allow alphabets
 *   - allows only one decimal point
 *   - allows only two digits after decimal point
 */
function isNumberKey(evt, element) {
  var charCode = (evt.which) ? evt.which : window.event.keyCode;
  if (charCode > 31 && (charCode < 48 || charCode > 57) && !(charCode == 46 || charCode == 8))
    return false;
  else {
    var len = $(element).val().length;
    var index = $(element).val().indexOf('.');
    if (index > 0 && charCode == 46) {
      return false;
    }
    if (index > 0) {
      var CharAfterdot = (len + 1) - index;
      if (CharAfterdot > 3) {
        return false;
      }
    }

  }
  return true;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" class="form-control" id="rate" name="rate" placeholder="Billing Rate" required onkeypress="return isNumberKey(event,this)">

谢谢。