javascript、html5表单。为什么'；这不管用吗？_Javascript_Html

javascript、html5表单。为什么'；这不管用吗？

javascript html

javascript、html5表单。为什么'；这不管用吗？,javascript,html,Javascript,Html,我刚刚开始学习javascript，所以这可能是我忽略的非常简单的东西 <!DOCTYPE html> <html> <head> <script> function calculatePayment() { //formula: M = P * ( J / (1 - (1 + J) ** -N)) Monthlypayment.value=balance.value; } </scr

我刚刚开始学习javascript，所以这可能是我忽略的非常简单的东西

<!DOCTYPE html>
<html>
<head>
<script>
    function calculatePayment()
    {
        //formula: M = P * ( J / (1 - (1 + J) ** -N))
        Monthlypayment.value=balance.value;

    }
</script>
</head>

<body>

<form onsubmit="return false" name="MortgageCalculator" oninput="calculatePayment()">
<fieldset>
    <legend>Loan Basics</legend>
    <div>
        <label for="balance">Beggining Balance: </label><input type="number" name="balance" min="10000" max="5000000" step="10000" size="7" value="150000" required>
    </div>
    <div>
        <label for="rate">Interest Rate (%): </label><input type="number" name="rate" min="0" max="99" step=".25" size="4" value="4.5" required>
    </div>
    <div>
        <label for="term">Term (months): </lable><input type="number" name="term" min="6" max="360" step="1" size="3" value="360" required>
    </div>
    <div>
        <input type="submit" value="Submit" onclick="calculatePayment()">
    </div>
</fieldset>

<div class="calculations">
    <label for="MonthlyPayment">Monthly Payment: </label><output name="MonthlyPayment" for="balance rate term" form="MortgageCalculator" onforminput="Monthlypayment.value=balance.value"></output>
</div>
</form>



</body>
</html>


函数calculatePayment（）
{
//公式：M=P*（J/（1-（1+J）**-N））
Monthlypayment.value=balance.value；
}
贷款基础
乞讨余额：
利率（%）：
任期（月）：
每月付款：

它似乎正确地进入了函数，但实际上我无法更改输出以显示任何内容。

尝试替换

Monthlypayment.value=balance.value;

与

参考：

阅读javascript中的作用域也很好：

您只需以您的表单

oninput

进行计算，如下所示：

<form onsubmit="return false;" name="MortgageCalculator" oninput="MonthlyPayment.value = balance.value">

<input type="submit" value="Submit" onclick="MonthlyPayment.value = balance.value;">

您还可以按如下方式更改“提交”按钮：

<form onsubmit="return false;" name="MortgageCalculator" oninput="MonthlyPayment.value = balance.value">

<input type="submit" value="Submit" onclick="MonthlyPayment.value = balance.value;">

有关更多详细信息，请查看以下参考：

由于您是javascript新手，我想建议另一种执行计算的方法

这种方法将更具可读性和灵活性。目前，如果您的公式发生更改，您必须在多个位置进行更改

我建议为每个

输入

字段创建

id

在javascript函数中，我建议使用有意义的名称创建变量。最后，您需要使用

parseInt（）

，因为我认为

表单

上的

输入

字段的

值

是

字符串

格式

JS小提琴示例：

HTML:

<label>Value 1</label>
<input type="number" id="value1"></input>

<label>Value 2</label>
<input type="number" id="value2"></input> <br>  

<button type="button" onclick="doMaths();">Calculate</button><br>

<label>Result</label>
<input type="number" id="result"></input>

function doMaths() {
var val1 = document.getElementById("value1");
var val2 = document.getElementById("value2");
var result = document.getElementById("result");

result.value = parseInt(val1.value) + parseInt(val2.value);
}

您应该从以下内容开始：。还考虑在文档准备好时运行脚本。如果使用jQuery只是更改$（function（）{}），您确定

Monthlypayment

不是空的吗？你检查错误控制台了吗？@Daniel我没有使用jQuery，应该吗？我相信表单中输入的

字段的.value
与字符串一样。在执行计算之前，您必须使用parseInt（）
将它们转换为整数。这似乎没有改变任何东西。我添加了一些编辑。阿桑的回答很好。但是，如果要在calculatePayment（）函数中执行此操作，则需要从document对象开始处理表单元素。似乎仍然没有改变任何内容。。。看看我这里有什么，以后的计算会更复杂，所以我觉得这些名字不错。我只是开始简单地看看它是否有效。。但事实并非如此。但是谢谢你的帮助@戈尔：不用担心，一天结束时，有多种方法可以做你想做的事。关于计算，我更喜欢易读的东西。很高兴它对你有用，我简化了它，以便在开始真正计算之前看看它是否能工作。所以最后我真的需要一个函数来工作。