JavaScript alert(), prompt(), and confirm()
Let's consder the following two JavaScript commands:
We will look at each of these in detail, considering alert() first.
The alert() command pops up a message box displaying whatever you put in it. For example:
<script type="text/javascript">
//<![CDATA[
alert("Hello!")
//]]>
</script>
As you can see, whatever you put inside the quotation marks, alert() will display it.
The prompt() is a bit more complicated because it is used to allow a user to enter something, and do something with that info:
<script type="text/javascript">
//<![CDATA[
var username;
username=prompt("please enter your name");
alert("Hi " + username + "!");
//]]>
</script>
The prompt() will store whatever the user typed in the prompt box using the variable called username. Then the script will display it using alert().
The confirm is used to confirm a user about certain action, and the if-else conditional can be then used to decide between two choices depending on what the user chooses. Let's see an example
<script type="text/javascript">
//<![CDATA[
var response;
response=confirm("Are you willing to work hard too succeed?");
if (response)
{
alert("Good! Then you are likely to succeed!");
}
else
{
alert("Too bad!!");
}
//]]>
</script>
The JavaScript if-else Conditional
Like alert(), prompt(), and confirm(), Date() is a built-in JavaScript fucntion which can be used to place such things as on the page. Let's use the conditional if-else to display an appropriate greeting based upon the time of day on the page:
This example demonstrates how the JavaScript if...else
conditional
statement can be used to personalize a page. If it is before noon,
you get a "Good morning!" greeting.
Otherwise you get a "Good afternoon!" greeting. It is
completed with:
<script type="text/javascript">
//<![CDATA[
var today = new Date();
var time = today.getHours();
if (time < 12)
{
document.write("<h3>Good
morning!</h3>");
}
else
{
document.write("<h3>Good
afternoon!</h3>");
}
//]]>
</script>
You use the conditional statement in JavaScript to make decisions. The general syntax for it is as follows:
if (condition)
{
statements
}
The condition in the parenthesis ( ) is evaluated to determine if true, and if so then the statements inside the curly braces { } are executed, otherwise they are skipped and the programs continues with the first line after the if statement. An optional else statement can be included with the if statement as follows:
if (condition)
{
statements
}
else
{
statements
}
In the following example all of the page's content is
determined by the decision returned from the confirm().
Try both OKAY and Cancel in JS-if.html which uses the
following code:
<html>
<head>
<title>An Example of Using a JavaScript
Conditional</title>
<body>
<script type="text/javascript">
//<![CDATA[
var decision=confirm("I hope you like Spring!");
if (decision)
{
document.bgColor="yellow";
document.write("<h2>This Page Sends You to Spring!</h2>");
document.write("<hr />");
document.write("<p><img src='spring.jpg' alt='spring' width='326' height='101' /><br />");
document.write("Spring begins on the vernal equinox and ends on the summer solstice.<br />");
document.write("For more info, go to <a href='http://www.reference.com/search?q=spring'>>What is Spring?</a>.");
document.write("</p><hr />");
}
else
{
document.bgColor="lightblue";
document.write("<h2>This Page Sends You to Winter!</h2>");
document.write("<hr />");
document.write("<p><img src='winter.jpg' alt='winter' width='326' height='101' /><br />");
document.write("Winter begins on the winter solstice and ends on the vernal equinox.<br />");
document.write("For more info, go to <a href='http://www.reference.com/search?q=winter'>What is Winter?</a>.");
document.write("</p><hr />");
}//]]>
</script>
</body>
</html>
Your task in this assignment is to construct a webpage which can be used to compute a student's grade in this course and determine whether or not the student will be passing the course once the exam E2 is returned. So far, have a quiz percentage, an assignment percentage, and will soon have earned grades on Exam E1. According to the syllabus, each of these grades is equally weighted, so you will need to prompt the user to enter these three different grades, which will each be between 0 and 100. Then you will need to find the average of these and store it in a JavaScript variable. According to the syllabus, a final course average of 60 percent or higher is passing. Use a conditional statement to determine whether or not a student is passing based upon the stored average which you computed. Be sure to test your page out using different values to determine whether or not it is working correctly.
To complete your page, use the following guidelines.
Copyright © 2011 Jan Pearce