JavaScript中的表单验证数据类型错误

Question

在所有情况下，我都会完成登录，而且这会将值视为字符串而不是数字....

---

function valid() {

  let value = document.getElementById('box').value;

  alert(typeof value)
  if (isNaN(value) || value < 1 || value > 20) {
    alert("Login Done")
  } else if (name = '') {
    alert("try agin")
  }
}

Answer 1

否定isNaN(value)检查。还要在比较之前将其转换为数字，以减少混乱

function valid() {

  let value = document.getElementById('box').value;
  
  let parsedValue = isNaN(value) ? 1 : parseInt(value, 10);
  
  console.log(typeof value);
  console.log(typeof parsedValue);
  
  if (parsedValue < 1 || parsedValue > 20) {
    console.log("Login Done")
  } else {
    console.log("try agin")
  }
}

valid();

document.getElementById('box').addEventListener('keyup', valid);

<input id="box" value="21" />