如果和switch语句结果无法正确显示

时间:2018-10-30 18:29:43

标签: javascript html5

我正在尝试编写一个小型的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;

}

3 个答案:

答案 0 :(得分:2)

您的代码有几个问题:

  • 正如 @rlemon 所指出的,您有一个location ~* ^/kibana\/?(?<baseuri>.*) { ... rewrite (?i)/kibana/(.*) /$1 break; rewrite (?i)/kibana$ / break; ... } span,但是您尝试在id="Score"下找到它(请注意字母大小写)在{{1}中和scoreConvertGrade()下。

  • Grade语句缺少ResetForm()关键字和相应的表达式。我猜您想使用switch

  • switch中每个switch (true)中的条件是相反的:

case
  • 如果使用switchgrade >= 92.9 && grade <= 90.0 // no number is greater than 92.9 and smaller than 90.0 ,则在93和92.9中设置限制是没有意义的。相反,请执行<=>=

  • 实际上,您不需要那种事件。您正在使用>= 93语句,因此没有必要为每个< 93设置上限和下限。设置较低的一个。

  • 没有验证break中提供的数据,以检查该值是否实际上是数字。 (感谢您 @ A.Meshu

  • 您没有清除case中的Value1元素(我已经指出您将其命名为score,现在我的意思是您在之后忘记了ResetForm() Grade

另外一个提示。有几种约定可以编写HTML属性和JavaScript变量的名称。我不会推荐你的。我只是建议您选择一个并坚持下去。它将为您免除以后的麻烦。

您的代码应像下面的代码片段所示:

= ''
innerHTML

答案 1 :(得分:0)

  

我认为您的切换语法不正确。

switch(expression) {
case x:
    code block
    break;
case y:
    code block
    break;
default:
    code block
}

答案 2 :(得分:0)

其他用户已经编写了有关您代码的其他一些问题,因此我不再赘述,但是我确实想写一下您对predictions = your_clf.predict(X_test1) classification_report(y_test1, prediction) 的使用。

虽然可能已建议您switch在此处进行良好的控制,但出于您的目的switch,条件更合适且更短。 if通常适用于其他情况(通常在switch且这些情况是针对要解决的语句进行测试的情况,而不是像the documentation suggests这样的单个值),但是我认为这是错误的。

因此,以下是在这种情况下一系列switch (true)条件比if可以做得更好的方法的分解。希望有一定用处。

switch
// pick up the container elements
const q1 = document.querySelector('#q1');
const q2 = document.querySelector('#q2');

// attach change listeners to the input boxes
q1.querySelector('input').addEventListener('change', handleOddEven, false);
q2.querySelector('input').addEventListener('change', handlePercentage, false);

function oddEven(n) {

  // ternary operator which says
  // if the modulo of 2 is 0 return even, otherwise odd
  return n % 2 === 0 ? 'even' : 'odd';
}

function findLetterGrade(n) {
  let grade = 'A';

  // drop through the conditions to match the grade
  if (n <= 93) grade = 'A-';
  if (n <= 90) grade = 'B';
  if (n <= 87) grade = 'B-';
  if (n <= 83) grade = 'C';
  if (n <= 80) grade = 'D';
  if (n <= 70) grade = 'E';
  if (n <= 60) grade = 'F';
  return grade;
}

function handlePercentage() {

  // coerce the string value to a number
  const val = parseInt(this.value, 10);

  // add the returned result from findLetterGrade to the
  // textContent of the corresponding span
  q2.querySelector('span').textContent = findLetterGrade(val);
}

function handleOddEven() {
  const val = parseInt(this.value, 10);

  // is the value a number?
  const isNumber = !Number.isNaN(val);
  let txt;
  if (isNumber) {
    txt = `This is a number. It is ${oddEven(val)}`;
  } else {
    txt = 'This is not a number';
  }
  q1.querySelector('span').textContent = txt;
}