Question

＆＃13;

window.onload = function init() {
  console.log("DOM is ready!");
  var input, value;
  
  input = document.getElementById("yourGuess");
  input = input.value;
  
  input.addEventListener("checking", check, false);
  
  check(value);
  
}

function check(value) {
  if(input < 0 && input > 10) {
    alert("The number must be between 0 - 10");
    value = 0;
  }
}

＆＃13;

<label for="yourGuess">You choose: </label>
<input id="yourGuess" type="number" min="0" max="10">

＆＃13;

我无法在任何与上述问题相对应的地方找到任何解决方案。

所以我有一个数字类型输入，并分别声明了一个min和max属性，值为0和10。

用户可以单击输入字段并将其值更改为范围之外，因此我需要使用javasricpt检查所做的任何更改

Answer 1

您正在使用字符串值覆盖HTMLInputElement，因此您收到错误。
使用onchange事件以及document.addEventListener。
我DOMContentLoaded方法让您更好地了解而不是使用window.onload！

document.addEventListener('DOMContentLoaded',function() {
    document.querySelector("#yourGuess").onchange=check;
},false);

function check(event) {
   if(event.target.value > 10 || event.target.value < 0){
      alert("The number must be between 0 - 10");
      event.target.value = 0;
   } 
}

<label for="yourGuess">You choose: </label>
<input id="yourGuess" type="number" min="0" max="10">

Answer 2

代码中的多个问题

您将input设置为input.value，因此输入成为String，而addEventListener
使用change事件代替checking。
check方法无法查看input，因此请依赖event.target。
您的if条件需要 OR ||而不是&&

<强>演示

＆＃13;

window.onload = function init() {
  console.log("DOM is ready!");      
  var input = document.getElementById("yourGuess");
  input.addEventListener("change", check, false);
}

function check ( event ) 
{
  var input = Number(event.target.value);
  console.log(input);
  if(input < 0 || input > 10) {
    alert("The number must be between 0 - 10");
    value = 0;
  }
}

＆＃13;

<label for="yourGuess">You choose: </label>
<input id="yourGuess" type="number" min="0" max="10">

＆＃13;

Answer 3

＆＃13 ;

＆＃13;

function change(){
var num = document.getElementById("num").value;
if(num > 10 || num < 0){
alert("Number is not in range");
}
}

＆＃13;

<input id="num" type="number" min="0" max="10" onchange="change()">

＆＃13;

如果您手动输入数字，那么您应该留下该输入字段进行检查，或者您可以使用其他方法，例如onkeypress等。

Answer 4

您正在将addeventlistener设置为输入值。

您正在尝试在check函数中使用输入，但在该方法中不可用，因为它未在该函数的范围内定义。

    window.onload = function init() {
       console.log("DOM is ready!");
       var value;
       var input = document.getElementById("yourGuess");
       value = input.value;
       input.addEventListener("change",check)
    }
    
    function check() {
        if(this.value < 0 || this.value > 10) {
            alert("The number must be between 0 - 10");
                value = 0;
            }
        }

        <label for="yourGuess">You choose: </label>
        <input id="yourGuess" type="number" min="0" max="10">

纯javascript检测数字类型输入值的变化

4 个答案: