javascript - 如何阻止 isNaN 为空白字段返回错误？

Question

编辑:

好的，所以我正在更新这个问题，以展示我已经构建的内容，因为我仍然无法解决这个问题。这是我得到的图像。如您所见，

当用户输入一个值时，计算(它们只是百分比，总计算是“onkeyup”完成的。正如你所看到的，因此它们返回“NaN”。有没有办法让我停止显示字段一个 NaN 然后随后只显示总值？

我考虑过这个问题，我可以让所有字段在输入到最终字段后立即进行计算吗？你怎么认为。向所有之前回答过我的问题的人道歉，我仍在努力找出最好的方法，我只是对 JavaScript 不如对 HTML/CSS 好!!

Answer 1

您应该尝试编写一个 checkNumber 函数，将输入的值作为其参数(而不是直接引用函数内的每个字段)。像这样:

var checkNumber = function (testval) {
  if ( isNaN(testval) ) {
    alert('Bad!');
    // clean up field? highlight in red? etc.
  } else {
    // call your calculation function
  }
}

然后将该函数绑定(bind)到每个表单字段的 keyup 事件。有多种方法可以做到这一点。查看addEventListener() ，或 jQuery 等框架的绑定(bind)功能(例如 .delegate() 或 .keyup())。

请注意，如果您确实将函数绑定(bind)到事件，则不必显式传入值参数。您应该能够通过 this.value 在函数中使用字段的值。所以你会有这样的东西:

var checkNumber = function () {
  if ( isNaN( this.value ) ) {
    alert('Bad!');
    // clean up field? highlight in red? etc.
  } else {
    // call your calculation function
  }
}

然后(通过 ID 的简单绑定(bind)方法):

document.getElementById('id_of_a_field').addEventListener('keyup', checkNumber, true);