Javascript计算器未回答的问题

Javascript calculator unanswered questions

本文关键字:问题 计算器 Javascript      更新时间:2023-09-26

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

1) 当一个字段没有填写时,我希望它发出警报,并将注意力重新集中在尚未填写的最前面的输入字段上。例如,填写了Apr,但没有填写贷款期限,所以重点应该回到贷款期限文本框。

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>

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

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