Javascript不适用于更改的值

Question

我得到了这个输入：

<input name='num2' type='number' id=num2 onblur="checkValue(this)">
        <script>
    function checkValue(input) {
    console.log(input.value);
  if (input.value > 20) {
     return input.value = 20;
  } else if (input.value < 0){
     return input.value = 0;
  } else if (input.value == '' || isNaN(input.value)) {
     return input.value = 0;
  } else {
     return input.value;
  }
}
$("#num1, #num2").focusout(function() {
    $("#answer").html('');
    var num1 = $("#num1").val();
    var num2 = $("#num2").val();
    var answer = num1 * num2;
    $("#answer").html(answer);
});
        </script>

问题是，当我写的数字高于 20 时，输入值会发生变化，但 javascript 仍然继续以我输入的数字计数，例如 100000。但我希望 javascript 计数onblur 改变了值。如果我走正确的路或者我应该使用其他脚本，请至少告诉我。

Answer 1

解决方案非常简单.. :) 对不起这个话题.. 确实是我必须为 if 添加更多价值，但如果有人有更好的直接模糊结果，请发布它

 <input name="num1" type='number' id=num1 value="<?php echo round($final5, 2); ?>" disabled><br />
 <input name='num2' type='number' id=num2 onblur="checkValue(this)">
        <script>
    function checkValue(input) {
    console.log(input.value);
  if (input.value > 10) {
     return input.value = 10;
  } else if (input.value < 0.09){
     return input.value = 0.1;
  }  else {
     return input.value;
  }

}

$("#num1, #num2").focusout(function() {
    $("#answer").html('');
    var num1 = $("#num1").val();
    var num2 = $("#num2").val();
    if (num2 > 10) {
        num2 = 10;
    } else if (num2 < 0.1 ) {
        num2 = 0.1;
    } else {
        num2;
    }
    var answer = num1 * num2;
    $("#answer").html(answer);
});
        </script>

Answer 2

如果您运行下面的代码，您将看到focusout 处理程序在onblur 处理程序之前被调用。

function checkValue(input) {
  console.log('blur', input.value);
  if (input.value > 20) {
     input.value = 20;
  }
  else if (input.value < 0){
     input.value = 0;
  }
  else if (input.value == '' || isNaN(input.value)) {
     input.value = 0;
  }
  else {
     input.value;
  }

}
$("#num1, #num2").focusout(
  function() {
    $("#answer").html('');
    var num1 = $("#num1").val();
    var num2 = $("#num2").val();
    var answer = num1 * num2;
    console.log('focusout', num1, num2, answer);
    $("#answer").html(answer);
  }
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name='num1' type='number' id=num1>
<input name='num2' type='number' id=num2 onblur="checkValue(this)">
<div id="answer"></div>

因此，在计算 answer 之前，您不会限制 num2 中的数量。

也许您应该移动您的逻辑以将您的 num2 限制在 onblur 处理程序中。

更新

以下示例将在计算总数之前对两个输入字段设置限制。

如果这些示例都不是您想要的，请说明您想要的结果，以便我们提供帮助。

function checkValue(input) {
  console.log('blur', input.value);
  if (input.value > 20) {
     input.value = 20;
  }
  else if (input.value < 0){
     input.value = 0;
  }
  else if (input.value == '' || isNaN(input.value)) {
     input.value = 0;
  }
  else {
     input.value;
  }

}
$("#num1, #num2").focusout(
  function() {
    $("#answer").html('');
    var $num1 = $("#num1");
    var $num2 = $("#num2");
    checkValue($num1[0]);
    checkValue($num2[0]);
    var num1 = $num1.val();
    var num2 = $num2.val();
    var answer = num1 * num2;
    console.log('focusout', num1, num2, answer);
    $("#answer").html(answer);
  }
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name='num1' type='number' id=num1 onblur="checkValue(this)">
<input name='num2' type='number' id=num2 onblur="checkValue(this)">
<div id="answer"></div>