Javascript计算器未解答的问题

时间:2014-10-16 16:23:09

标签: javascript calculator

感谢大家的帮助!除了数学,我还有几个问题。

1)当一个字段没有填写时,我希望它抛出一个警报并重新关注尚未填写的最顶部的输入字段。例)4月填写,但不是贷款期限,所以焦点应该回到贷款期限文本框。

2)我不希望在填写所有文本字段之前显示每月付款。

我试过玩它,但它仍然不起作用:(

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <!-- This is assign05.html -->
 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> JavaScriptcript Mortgage Calculator </title>
<script>

    //Display the total sum
    function display(x, y, z) {
          var num = x + y + z;
    var n = num.toString();
document.getElementById("total").innerHTML = "Your monthly payment is " + n;
    }

    // Validate the form
    function validateForm(x, y, z) {
        var x = parseInt(document.forms["myForm"]["apr"].value);
        var y = parseInt(document.forms["myForm"]["loanTerm"].value);
    var z = parseInt(document.forms["myForm"]["loanAmount"].value);

    // If statements
    if (x==null || x=="") {
        alert("APR must be filled out");
        document.getElementById("apr").focus();
        return false;
    }
    else if (y==null || y=="") {
        alert("Loan Term must be filled out");
        document.getElementById("loanTerm").focus()
        return false;
    }
    else if (z==null || z=="") {
        alert("Loan Amount must be filled out");
        document.getElementById("loanAmount").focus()
        return false;
    }
    else {
        // Display
        display(x, y, z);
    }
    return false;
    }

    //Reset the form (this isn't working)
    function resetForm() {
        document.getElementById("myForm").reset();
    }
</script>
</head>
<body onLoad=document.getElementById("apr").focus();>
<form id="myForm" name="myForm" action="" onsubmit="validateForm(); return false;" method="post">
    APR: <input type="number" id="apr" value=""><br/>
    Loan Term: <input type="number" id="loanTerm" value=""><br/>
 Loan Amount: <input type="number" id="loanAmount" value=""><br/>

    <button onclick="myFunction()">Calculate Payment Button</button>
    <input type="button" onclick="resetForm()" value="Reset form">
</form>
<div id="total"></div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

在空字符串上运行parseInt()时(这是获取空文本字段的.value时得到的),它将返回NaN。简单的解决方案是添加额外的支票。

if(x==null || x=="" || x.toString()=="NaN"){}