|
Prompt viewers for input, and use the input to write a viewer's name
right on your page.
Well, let's say you wanted to get somebody's name before they saw the page, and then write
their name on your page right before their very eyes.......Well, you can do this using a javascript
prompt. Here's the command:
prompt('Your Question', ' ');
This will bring up a window asking the question of your choosing, with a space for the viewer to
answer. The second set of quotes allows you to enter a default answer. If you leave it blank,
the viewer will just see an empty box ready to be typed in.
This is usually done before the page loads, so that you can write the answer they give
into your page.
Now, for the script that made this work. Note how the prompt and if/else statements are
in the HEAD section, while the actual writing of the name occurs in the BODY section.
<SCRIPT language="JavaScript">
<!--hide
var yourname= prompt('Please enter your name, so you can get a special greeting', ' ');
if ( (yourname==' ') || (yourname==null) )
{
yourname="Dude";
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!--hide
document.write("<CENTER><H1>Hello, " + yourname + " ! Welcome to My Page! <\/H1><\/CENTER>");
//-->
</SCRIPT>
</BODY>
The first thing that happens is that the variable yourname is assigned the value it receives from
the user from the prompt. So the variable yourname will be a string of characters that makes up the
person's name. The if/else statement assigns yourname a value of "Dude" if nothing is entered
in the prompt by the user. It checks for " " and for null, and both are pretty much nothing.
Now, in the BODY section, you again use the SCRIPT tags to set off the JavaScript from any
HTML around it. You will also see a new command called document.write(" "); . This is what
allows the JavaScript variable yourname to be written onto the HTML document. You are
writing two strings plus your variable, yourname. The variable yourname is not in quotes
because it is a value and not itself a string (it's value is a string). That's why we have the plus
signs around it....It makes the browser write the first string plus the variable plus the second
string. Now, notice the HTML tags are inside the strings! Since this is a javascript, the only way
to write the HTML tags back to the page is by including them inside the quotes as part of the
string. Also, you probably noticed the way the closing tags were written differently. (<\/H1>).
The backslash is there as the javascript escape character. It allows you to write the forward slash
without it being mistaken for a division sign! (Remeber / is division in JavaScript). Thus using the
backslash followed by a forward slash ultimately gives us.......our single forward slash.
Pretty nifty trick, isn't it?
|
Tutorials 
