我正在尝试编写一个小的 javascript 程序，它将做 3 件事，1. 它将确定一个数字是奇数还是偶数并将结果显示在网页上，2. 根据输入的数字计算字母等级通过 switch 语句访问网页，以及 3. 根据按钮的按下重置表单。
奇偶部分和重置部分似乎工作正常，但等级切换语句不起作用。它似乎没有显示与输入值相对应的字母等级。我试着查看错误，但运气不佳。感谢您的帮助。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>WDV221 Intro Javascript</title>
<script src="Odd_Even_Grades.js"></script>
</head>
<body>
<h2>WDV221 Intro Javascript</h2>
<h3>Comparisons and IF Statements - Odds Evens and Grades</h3>
<hr />
<p></p>
<hr />
<form id="form1" name="form1" method="post" action="">
<p>Value 1:
<input type="text" name="Value1" id="Value1" />
</p>
<p>Result: <span id="Result"></span></p>
<p>
<input type="button" value="Is it Odd or Even?" onclick="OddEven()"/>
</p>
<p>
</p>
<h4>Enter the percentage that you have achieved:</h4>
<p> Percentage:
<input type="text" name="percent" id="percent" />
</p>
<p>Grade: <span id="Score"></span></p>
<p>
<input type="button" value="Calculate Grade" onclick="ConvertGrade()"/>
</p>
<p>
<input type="button" name="Reset" id="button" value="Reset" onclick="ResetForm()"/>
</p>
</form>
<p>Instructions:</p>
<ol>
<li>You are asked to create a working example in Javascript based upon the two given problems.</li>
<li>For each problem you have two deliverables:</li>
<li>Pseudo code algorithm and test plan.</li>
<li>A working example using Javascript.</li>
<li>The two problems you have been asked to resolve:</li>
<li>Get an input value, verify that it is a number, if it is a number determine whether it is even or odd.</li>
<li>Find the letter grade based upon the percentage grade. example: 54% is an 'F', 88% is a 'B', etc. This would be a good one to consider using a switch statement.</li>
</ol>
</body>
</html>
function ResetForm()
{
document.getElementById("form1").reset();
document.getElementById("Result").innerHTML = "";
document.getElementById("Grade").innerHTML;
}
function OddEven() {
//read in entered values from text fields
var Num1 = document.getElementById("Value1").value;
if (Num1 % 2 == 0)
{
document.getElementById("Result").innerHTML = "Even";
}
else
{
document.getElementById("Result").innerHTML = "Odd";
}
}
function ConvertGrade()
{
var grade = document.getElementById("percent").value;
{
case (grade >= 93.0 && grade <= 100):
LetterGrade = "A";
break;
case (grade >= 92.9 && grade <= 90.0):
LetterGrade = "A-";
break;
case (grade >= 89.9 && grade <= 87.0):
LetterGrade = "B+";
break;
case (grade >= 86.9 && grade <= 83.0):
LetterGrade = "B";
break;
case (grade >= 82.9 && grade <= 80.0):
LetterGrade = "B-";
break;
case (grade >= 79.9 && grade <= 70.0):
LetterGrade = "C";
break;
case (grade >= 69.9 && grade <= 60.0):
LetterGrade = "D";
break;
case (grade >= 59.9 && grade <= 0):
LetterGrade = "F";
break;
default:
LetterGrade = "Enter valid Number"
}
document.getElementById("score").innerHTML = LetterGrade;
}
最佳答案
您的代码有几个问题:
正如 @rlemon 所指出的，您有一个
span与id="Score"但您尝试在score下找到它(注意字母大小写)在ConvertGrade()在Grade下在ResetForm().switch语句缺少switch关键字和相应的表达式。我猜你想用switch (true).每个
case中的条件在switch里面是相反的:
grade >= 92.9 && grade <= 90.0
// no number is greater than 92.9 and smaller than 90.0
如果您使用
<=和>=将极限设置在 93 和 92.9 是没有意义的。相反，做>= 93和< 93.实际上，您不需要那样的事件。您正在使用
break语句，因此不需要为每个case设置上限和下限.只设置较低的那个。Value1中提供的数据未经过验证检查该值是否实际上是一个数字。 (谢谢 @A.Meshu)您没有清理
scoreResetForm()中的元素(我已经指出您将其命名为Grade，现在我的意思是您在= ''之后忘记了innerHTML。
一个额外的提示。编写 HTML 属性和 JavaScript 变量的名称有几种约定。我不会向你推荐任何东西。我只是建议你选择一个并坚持下去。它会让您以后不再头疼。
你的代码应该看起来像下面的代码片段:
function ResetForm() {
document.getElementById("form1").reset();
document.getElementById("Result").innerHTML = "";
document.getElementById("score").innerHTML = "";
}
function OddEven() {
//read in entered values from text fields
var Num1 = document.getElementById("Value1").value;
if (Number.isInteger(+Num1)) {
if (Num1 % 2 == 0) {
document.getElementById("Result").innerHTML = "Even";
} else {
document.getElementById("Result").innerHTML = "Odd";
}
} else {
document.getElementById("Result").innerHTML = "Not a integer";
}
}
function ConvertGrade() {
var grade = document.getElementById("percent").value;
switch (true) {
case (grade >= 93.0):
LetterGrade = "A";
break;
case (grade >= 90.0):
LetterGrade = "A-";
break;
case (grade >= 87.0):
LetterGrade = "B+";
break;
case (grade >= 83.0):
LetterGrade = "B";
break;
case (grade >= 80.0):
LetterGrade = "B-";
break;
case (grade >= 70.0):
LetterGrade = "C";
break;
case (grade >= 60.0):
LetterGrade = "D";
break;
case (grade >= 0):
LetterGrade = "F";
break;
default:
LetterGrade = "Enter valid Number"
}
document.getElementById("score").innerHTML = LetterGrade;
}<form id="form1" name="form1" method="post" action="">
<p>Value 1:
<input type="text" name="Value1" id="Value1" />
</p>
<p>Result: <span id="Result"></span></p>
<p>
<input type="button" value="Is it Odd or Even?" onclick="OddEven()" />
</p>
<p>
</p>
<h4>Enter the percentage that you have achieved:</h4>
<p> Percentage:
<input type="text" name="percent" id="percent" />
</p>
<p>Grade: <span id="score"></span></p>
<p>
<input type="button" value="Calculate Grade" onclick="ConvertGrade()" />
</p>
<p>
<input type="button" name="Reset" id="button" value="Reset" onclick="ResetForm()" />
</p>
</form>关于javascript - If 和 switch 语句结果显示不正确，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53070709/