isNaN 似乎没有正常工作

Question

谁能告诉我为什么下面的代码不能工作并提供一个可能的修复。当按下按钮时，我希望它根据用户是否在输入字段中输入数字来显示正确或错误。

HTML：

<!DOCTYPE html>
<body>
<p>Enter name:</p>
<input type="text" name="name"></input>
<button onclick="checkpeople()"  type = "button">check</button><br>
<p id="message"></p>
<script src="script.js"></script>
</body>

JS：

function checkpeople() {
var name = "";
if (isNaN(name)) {
name = "incorrect"
}
 else {
  name = "correct"
 }
document.getElementById('message').innerHTML = name;
}

Answer 1

isNAN(<argument>) 是一个判断给定参数是否为非法数字的函数。 isNaN 将参数类型转换为 Number 类型。如果要检查参数是否为数字？请在jQuery中使用$.isNumeric()函数。

也就是说，isNaN(foo) 等价于 isNaN(Number(foo)) 出于显而易见的原因，它接受具有所有数字作为数字的任何字符串。例如。

isNaN(123) //false
isNaN(-1.23) //false
isNaN(5-2) //false
isNaN(0) //false
isNaN('123') //false
isNaN('Hello') //true
isNaN('2005/12/12') //true
isNaN('') //false
isNaN(true) //false
isNaN(undefined) //true
isNaN('NaN') //true
isNaN(NaN) //true
isNaN(0 / 0) //true

jQuery.isNumeric(): https://api.jquery.com/jQuery.isNumeric/ 如果您对不使用 jQuery 并仅使用 javascript 来做这件事感到奇怪。您可以使用如下：isNan(parseInt(<argument>)) 或 isNan(parseFLoat(<argument>))

isNumber = function(obj){
  

  

    if (!isNaN(parseInt(obj))) {
  // Is a number
  return true;
}
else return false;
}

var num = 14;
var textnum = '14';
var text = 'yo';
var nan = NaN;

var DOM = document.getElementById("demo").innerHTML;
document.getElementById("demo").innerHTML =  isNumber(textnum, true);

<p id="demo"></p>

Answer 2

问题是checkPeople 函数中的变量name 没有链接到您的html 中的输入标记。您需要在checkPeople 函数中获取输入标签的值。我在下面提供了工作代码：

function checkpeople() {
var name = document.getElementById('myinput').value;
if (isNaN(name)) {
name = "incorrect"
}
 else {
  name = "correct"
 }
document.getElementById('message').innerHTML = name;
}

<!DOCTYPE html>
<body>
<p>Enter name:</p>
<input type="text" name="name" id="myinput"></input>
<button onclick="checkpeople()"  type = "button">check</button><br>
<p id="message"></p>
</body>

Answer 3

当数据不是数字时，isNaN() 返回 true。

function checkpeople() {
var name = document.getElementById('myinput').value;
if (isNaN(name)) {
name = "correct"
}
 else {
  name = "incorrect"
 }
document.getElementById('message').innerHTML = name;
}

<!DOCTYPE html>
<body>
<p>Enter name:</p>
<input type="text" name="name" id="myinput"></input>
<button onclick="checkpeople()"  type = "button">check</button><br>
<p id="message"></p>
</body>

Answer 4

首先isNaN代表is Not a Number，因此，

isNaN(12234) //will be false

虽然

isNaN("jsjsjw")// will return true.

因此，您的代码中的条件应该颠倒过来。也就是说，如果您希望自己的名字不是数字。

其次你的代码没有连接你的输入，你需要先从输入中获取值，然后再在 js 中检查它。

function checkpeople() {
var name = document.getElementById('myinput').value;
if (isNaN(name)) {
  name = "correct"
}
else {
  name = "incorrect"
}
document.getElementById('message').innerHTML = name;

Answer 5

使用isInteger。它比 isNaN 好得多。

Number.isInteger(0);         // true
Number.isInteger(1);         // true
Number.isInteger('10');      // false

以下是some problem with usingisNaN。

document.write(isNaN("")) // false
document.write(isNaN(" "))  // false
document.write(isNaN(0))  // false
document.write(isNaN(null)) // false
document.write(isNaN(false))  // false
document.write("" == false)  // true
document.write("" == 0)  // true
document.write(" " == 0)  // true
document.write(" " == false)  // true
document.write(0 == false) // true
document.write(" " == "") // false

如果您需要对 Internet Explorer 的支持，您可以使用polyfills。

尽可能使用原生 JavaScript。您可以通过 JavaScript 获得更多的学习曲线，同时减少对任何其他框架的依赖。

Answer 6

您没有选择从文本框中输入的值，而是简单地比较一个空白字符串。

var name = "";
if (isNaN(name)) {

以下是工作示例：

function checkpeople() {
  // changed variable name, as there is global variable already defined i.e. `window.name`
  var name_ = document.getElementsByName("name")[0].value;
  if (!name_ || isNaN(name_)) { // if not empty and not a number
    name_ = "incorrect"
  } else {
    name_ = "correct"
  }
  document.getElementById('message').innerHTML = name_;
}

<p>Enter name:</p>
<input type="text" name="name" />
<button onclick="checkpeople()" type="button">check</button><br>
<p id="message"></p>