Question

我正在尝试获取用户输入的数字并使用它们来计算值，然后在文本框中显示这些数字。当我提交值时，右侧的文本框不会更改。有任何想法吗？

<!DOCTYPE html>
<html>
<head>
  <title>Car Payment Calculator</title>
<style>
  html, body { 
    margin:0; 
    padding:0; 
  } 

  #pagewidth { 
    max-width:9000em;  
    min-width:1000em;  
  }

  #header {
    position:relative; 
    height:150px; 
    background-color:#06F9FC; 
    width:100%;
    display:block;
    overflow:auto;
  } 

  #maincol {
    background-color: #FCC66C;  
    position: relative; 
  }
</style>
    <HTA:APPLICATION ID="myCarPayment"
    APPLICATIONNAME="Car Payment Calculator"
    SYSMENU="yes"
    BORDER="thin"
    BORDERSTYLE="normal"
    CAPTION="yes"
    ICON=""
    MAXIMIZEBUTTON="yes"
    MINIMIZEBUTTON="yes"
    SHOWINTASKBAR="yes"
    SINGLEINSTANCE="yes"
    SCROLL="no"
    VERSION="1.0"
    WINDOWSTATE="normal"/>

  <script>
    window.resizeTo(300,300);

    function calculate() {
      var years= document.forms.myForm.years.value;  
      var monthly= amount/(years*12);  
      var number= monthly/amount;  
      var form = document.forms.myForm;  
      var loanAmount = form.loanAmount.value;  
      var downPayment = '0';  
      var anualInterestRate = form.interestRate.value;  
      var years = form.years.value;  
      var monthRate = anualInterestRate/12;  
      var numberOfPayments = years * 12;  
      var Principal=loanAmount-downPayement;  
      var valueNumber = document.getElementById("numPay");  
      var vlaueMonthly = document.getElementById("monthlyPay");  

      valueNumber.value = numberOfPayments;  
      valueMonthly.value = monthly;
    }  

  </script>
</head>
<body>
    <div id="header">
        <pre>
            <p>This application will help you calculate car payments.<br/>
Just enter the information and hit Calculate!</p>
        </pre>
    </div>
    <div id="maincol">
        <pre>
            <form name="myForm" action="" onsubmit="calculate()">
                <table>
                    <tr>
                        <td>Loan Amount:</td><td> <input type="number" name="loanAmount"></td>
                    </tr>
                    <tr>
                        <td>Interest Rate:</td><td> <input type="number" name="interestRate"></td><td>Number of Payments:</td><td><input type="text" name="numberPayments" id="numPay" value="0"></td>
                    </tr>
                    <tr>
                        <td>Number of Years:</td><td> <input type="number" name="years"></td><td>Monthly Payment:</td><td><input type="text" name="monthlyPayments" id="monthlyPay" value="0"></td>
                    </tr>
                    <tr>
                        <td><input type="submit" value="Calculate"></td>
                    </tr>
                </table>
            </form>
        </pre>
    </div>
</body>    
</html>

Answer 1

您的回调函数calculate()收到错误：

Uncaught ReferenceError: amount is not defined

您正在使用amount，但您尚未定义/声明它。

我不确定amount应该是什么价值。

Answer 2

同时从输入中获取值并使用parsetInt()将其转换为数字，您需要在计算前将它们转换为数字。

  var years =   parseInt(document.forms.myForm.years.value, 10);
  var loanAmount = parseInt(form.loanAmount.value, 10);  
  var valueNumber = parseInt(document.getElementById("numPay"), 10);  
  var vlaueMonthly = parseInt(document.getElementById("monthlyPay"), 10);

无法使用Javascript更改文本框中的值

2 个答案: