我的函数应该返回一个数字，但它一直返回"未定义"，我已经翻阅了我的教科书，无法弄清楚我哪里出错了。 我不确定我是否正确定义了我的变量，但我被困住了，任何方向都会不胜感激。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Greendale Community College</title>
<script type="text/javascript">
/* <![CDATA[ */
/* ]]> */
var creditTotal = document.getElementsByName("numCredits");
var tuitionCost = 0;
function calcTuition() {
tuitionCost = 302 * creditTotal;
}
</script>
</head>
<body>
<p><center><font face="impact" font size="200" color="green">Greendale Community College</font></center></p>
<center><img src="greendale.jpg" alt="greendale" width="512" height="256"/></center>
<h1><center>Tuition Calculator</center></h1>
<form name="tuitionCalculator" action="" method="get">
<h2>Semester</h2>
<h3>(choose a semester)</h3>
<input type="radio" name="semesterFall"/> Fall 2018 <br />
<input type="radio" name="semesterSpring"/> Spring 2018 <br />
<input type="radio" name="semesterSummer"/> Summer 2018 <br />
<h2>Residency</h2>
<h3>(choose your residency)</h3>
<input type="radio" name="instate" /> In-State <br />
<input type="radio" name="outstate" /> Out-of-State <br />
<input type="radio" name="international" /> International <br />
<h2>Credits</h2>
<h3>(enter your number of credits)</h3>
<input type="text" size="2" maxlength="2" name="numCredits" /><br />
<input type="button" onclick="window.alert(calcTuition())" value="Calculate Your Tuition" />
</form>
</body>
</html>
-
document.getElementsByName("numCredits")是具有 tagNamenumCredits的所有元素的集合。您需要使用[0]来指定顶部。 -
document.getElementsByName("numCredits")[0].value是为您提供输入值的人。然后不要忘记将其parseInt为整数。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Greendale Community College</title>
<script type="text/javascript">
/* <![CDATA[ */
/* ]]> */
function calcTuition() {
var tuitionCost = 0;
var creditTotal = document.getElementsByName("numCredits")[0].value;
console.log(creditTotal);
tuitionCost = 302 * parseInt(creditTotal);
return tuitionCost;
}
</script>
</head>
<body>
<p><center><font face="impact" font size="200" color="green">Greendale Community College</font></center></p>
<center><img src="greendale.jpg" alt="greendale" width="512" height="256"/></center>
<h1><center>Tuition Calculator</center></h1>
<form name="tuitionCalculator" action="" method="get">
<h2>Semester</h2>
<h3>(choose a semester)</h3>
<input type="radio" name="semesterFall"/> Fall 2018 <br />
<input type="radio" name="semesterSpring"/> Spring 2018 <br />
<input type="radio" name="semesterSummer"/> Summer 2018 <br />
<h2>Residency</h2>
<h3>(choose your residency)</h3>
<input type="radio" name="instate" /> In-State <br />
<input type="radio" name="outstate" /> Out-of-State <br />
<input type="radio" name="international" /> International <br />
<h2>Credits</h2>
<h3>(enter your number of credits)</h3>
<input type="text" size="2" maxlength="2" name="numCredits" /><br />
<input type="button" onclick="window.alert(calcTuition())" value="Calculate Your Tuition" />
</form>
</body>
</html>