Javascript nicht mit geändertenem Wert arbeitet

Question

ich diesen Eingang bekam:

<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> 

das Problem ist, dass, wenn ich die Nummer whitch schreibe höher als 20, so der Eingangswert ändern, aber JavaScript noch mit zählen weiterhin was auch immer die Nummer ich schreibe, zum Beispiel 100000. Aber ich möchte, dass Javascript mit dem Onblur Wert zu zählen. Bitte zeig mir zumindest ob ich den richtigen Weg gehe oder ein anderes Skript verwenden soll.

Answer 1

Wenn Sie den Code ausführen unten sehen Sie, dass die focusout Handler vor die onblur Handler aufgerufen wird.

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>

Sie sind also nicht die Zahl in num2 bis zu begrenzen, nachdem Sie Ihre answer berechnen.

Vielleicht sollten Sie Ihre Logik verschieben, um Ihre num2 innerhalb der onblur Handler zu begrenzen.

UPDATE

Das folgende Beispiel wird die Grenzen auf beiden Eingabefelder festlegen, bevor die Summen berechnet wird.

Wenn keines dieser Beispiele das ist, was Sie wollen, dann erläutern Sie bitte Ihr gewünschtes Ergebnis, damit wir Ihnen helfen können.

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>

Answer 2

Lösung war sehr einfach .. :) zu diesem Thema sorry .. wahr ist, dass ich mit, wenn mehr Wert hinzufügen, musste ,, aber wenn jemand ein besseres Ergebnis hat direktes Post für Unschärfe Bitten es

<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>