NaN Fehler beim Multiplizieren

Question

Ich habe dieses Skript, um zwei Spalten zu multiplizieren und die Summe in der dritten anzuzeigen. Hier ist es Code:

<script> 
$(function() { 
    $("#num1, #num2").on("keydown keyup", sum); 
    function sum() { 
    $("#total").val(Number($("#num1").val()) * Number($("#num2").val())); 
    } 
}); 
</script> 

und Form:

<form method="POST" name="form1" action="" "> 

<label>num1</label> 
<input name="num1" id="num1" type="text" value="SOMENUMBER" /> 

<label>num2</label> 
<input type="text" name="num2" id="num2" value="SOMENUMBER"/> 

<label>total</label> 
<input type="text" name="total" style="width: 40%;" id="total" readonly /> 

<button class="square" name="btn" type="submit">SOMEBUTTONNAME</button> 

</form> 

Answer 1

Sie haben 3x " in HTML: action="" ".

Dieser Code verhindert nicht numerische Zeichen und berechnet das Ergebnis auf die Schaltfläche "Klick" oder ändert eine Zahl.

function sum() { 
 
    var num1 = $("#num1").val().replace(",","."); 
 
    var num2 = $("#num2").val().replace(",","."); 
 
    var decimals_prepare = (num1.indexOf(".") > -1) ? num1.split(".")[1].length : 0; 
 
    
 
    return (!isNaN(num1) && !isNaN(num2)) ? $("#total").val((num1 * num2).toFixed(decimals_prepare)) : console.log("false"); 
 
} 
 

 
$(function() { 
 
    $("#num1, #num2").on("keydown keyup", sum); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form method="POST" name="form1" action=""> 
 

 
    <label>num1</label> 
 
    <input name="num1" id="num1" type="text" value="5" /> 
 

 
    <label>num2</label> 
 
    <input type="text" name="num2" id="num2" value="2" /> 
 

 
    <label>total</label> 
 
    <input type="text" name="total" style="width: 40%;" id="total" readonly /> 
 

 
    <button class="square" name="btn" type="submit" onclick="sum()">SOMEBUTTONNAME</button> 
 

 
</form>

Answer 2

Überprüfen Sie, ob Sie gültige Zahlen haben erste

function sum() { 

    var value1 = $("#num1").val(); 
    var value2 = $("#num2").val(); 

    if (isNaN(value1) || isNaN(value2){ 
     return; 
    } 

    $("#total").val(Number(value1) * Number(value2)); 
}