How to add several options for user input in an if statement
Question
I'm trying to make a code where you can get a letter grade from a percentage grade. The grading scale is printed at the top of the code. Then, I made a button where when you click it, it prompts the suer to input their percentage grade. Im trying to make it so if the user inputs, for example, 93 the code will tell them they have an A. Im trying to do this for all values of 100-90 for an A, 89-80 for a B, 79-70 for a C, 69-60 for a D, 59-50 for an E, and anything less than 50 for an F. I have the code for the grade scale and I started the function for the function that will give the user their letter grade, but cannot figure out how to have more than one value in the if statement.
function myFunction() { var q1 = prompt("Please enter your percentage grade: "); if (q1 <= 100 && grade > 90) { alert("You have an A"); } if (q1 <= 89 && grade > 80) { alert("You have a B"); } if (q1 <= 79 && grade > 70) { alert("You have a C"); } if (q1 <= 69 && grade > 60) { alert("You have a D"); } if (q1 <= 59 && grade > 50) { alert("You have an E"); } if (q1 > 50) { alert("You have an F"); } else { alert("Broken") } }
<html> <body> <h1>Grade Scale</h1> <p> <table> <tr> <th>A</th> <th>B</th> <th>C</th> <th>D</th> <th>E</th> <th>F</th> </tr> <tr> <td>100-90</td> <td>89-80</td> <td>79-70</td> <td>69-60</td> <td>59-50</td> <td> < 50</td> </tr> </table> </p> <p2> <button onclick="myFunction()">Click Here To See Your Conversion!</button> </p2> </body> </html>
2 answers
solution1
1 2019-03-26 14:47:13
You can achieve this with if - else statements. This will ensure that only one condition matches for all the if blocks - and you also need just a single condition for each if statement:
<p> <button onclick="myFunction()">Click Here To See Your Conversion!</button> </p> <script> function myFunction() { var grade = prompt("Please enter your percentage grade: "); if (grade > 90) { alert("You have an A"); } else if (grade > 80){ alert("You have a B"); } else if (grade > 70){ alert("You have a C"); } else if (grade > 60){ alert("You have a D"); } else if (grade > 50){ alert("You have an E"); } else { alert("You have an F"); } } </script>
By the way: please check your variables and use the same name for all ( q1 and grade should be the same I guess).
solution2
0 2019-03-26 14:55:29
The main issue was that your variables were not named consistently, so I changed them all to q1. Your logic with the > conditions was also a bit off, so I changed them so they account for the correct ranges. Remember, for something like a B, it will be all numbers less than 90 and greater than or equal to 80. 90 > B >= 80
Also as others have mentioned <p1> and <p2> are not proper html tags. Please use <p> instead.
function myFunction() { var q1 = prompt("Please enter your percentage grade: "); if (q1 <= 100 && q1 >= 90) { alert("You have an A"); } else if (q1 < 90 && q1 >= 80) { alert("You have a B"); } else if (q1 < 80 && q1 >= 70) { alert("You have a C"); } else if (q1 < 70 && q1 >= 60) { alert("You have a D"); } else if (q1 < 60 && q1 >= 50) { alert("You have an E"); } else if (q1 < 50 && q1 >= 0) { alert("You have an F"); } else { alert("Broken") } }
<!DOCTYPE html> <html> <body> <h1> Grade Scale </h1> <p> <table> <tr> <th>A</th> <th>B</th> <th>C</th> <th>D</th> <th>E</th> <th>F</th> </tr> <tr> <td>100-90</td> <td>89-80</td> <td>79-70</td> <td>69-60</td> <td>59-50</td> <td>< 50</td> </tr> </table> </p> <p> <button onclick="myFunction()">Click Here To See Your Conversion!</button> </p> </body> </html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.