这是我第一次使用外部 Javascript 文件。我正在 Murach 系列有关 Javascript 的书籍中进行练习，但我仍然停留在一些非常基本的事情上。我将展示我所做的 Javascript 编码，然后我将展示 html 文件。每当我单击按钮来计算 future 值时，即使我有 onload 事件处理程序，它也不会执行任何操作。
/*Javascript*/
var $ = function(id) {
return document.getElementById(id);
};
function calculateFV(investment, interest, years) {]{
investment = $("investment").parseFloat($("investment").value);
interest = $("annual_rate").parseFloat($("annual_rate").value);
years = $("years").parseInt($("years").value);
var cInterest = investment * interest;
cInterest = parseFloat(cInterest);
futureValue = parseFloat(futureValue);
for (var i = 1; i < years; i++) {
investment = investment + (cInterest / 100);
}
investment = parseFloat(investment).toFixed(2);
$ ("future_value") = investment;
}
window.onload = function() {
$("calculate").onclick = calculateFV;
$("investment").focus();
};
/* End of Javascript */
/* HTML */
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Future Value Calculator</title>
<link rel="stylesheet" href="future_value.css">
<script src="future_value.js"></script>
</head>
<body>
<main>
<h1>Future Value Calculator</h1>
<label for="investment">Total Investment:</label>
<input type="text" id="investment">
<span id="investment_error"> </span><br>
<label for="rate">Annual Interest Rate:</label>
<input type="text" id="annual_rate">
<span id="rate_error"> </span><br>
<label for="years">Number of Years:</label>
<input type="text" id="years">
<span id="years_error"> </span><br>
<label for="future_value">Future Value:</label>
<input type="text" id="future_value" disabled><br>
<label> </label>
<input type="button" id="calculate" value="Calculate"><br>
</main>
</body>
</html>
/* End of HTML */
最佳答案
无论您的代码中存在哪些打印错误，我都想提一下您还犯了一些其他错误:
parseInt()是一个函数；不是一种方法。因此必须将其用作函数。像这样:investment = parseFloat($("investment").value);而不是:investment = $("investment").parseFloat($("investment").value);$("future_value")是文本框；不是它的值(value)。要真正让某些内容出现在$("future_value")中，您必须说:$("future_value").value = Investment。您的
calculateFV()函数不应包含任何参数。Investment、interest和years是函数内的局部变量，因此您的函数不需要任何输入。你解析太多而且不小心。在您的代码中，您可以这样写:
cInterest = parseFloat(cInterest);和futureValue = parseFloat(futureValue);
• 我们使用parseFloat()code> 解析字符串。上述变量包含数学运算后发生的算术值，而不是字符串。因此您不需要解析它们。
我创建了一个 jsFiddle，您的代码已更正并正常运行。可以找到here .
祝你学习顺利☺
关于javascript - 如何在 HTML 中使用外部 Javascript 文件中的函数？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38069573/