Javascript Tutorial #2
Welcome to the second tutorial. Hope you got on alright with the first. No? Send me an email if there is something you don't understand and I'll try to help. Last time, I left you with a finished program and I ended by explaining about putting comments in your code. But wait, did you update your template file so that comments can be added more easily. No? This is what it should look like:-
<html>
<SCRIPT Language="Javascript">
<!--
// Author:-
// Date:-
// Description:-
// Comments:-
// -->
</SCRIPT>
<body>
</body>
</html>
This is the file you should continue to use from now on
so save it as template.htm as before. On
with some new stuff.
One of the first things you will want to do is display messages. The simplest way is to use a message box or alert in JavaScript speak. Here's it's simplest form:-
alert('Hello');
To test this, cut and paste and place it between the script tags. Your program should look something like this:-
<html>
<SCRIPT Language="VBScript">
<!--
' Author:- Nick
' Date:- Today
' Description:- Messages
' Comments:- A msgbox program
Option Explicit
alert('Hello');
-->
</SCRIPT>
<body>
</body>
</html>
Save as alert.HTM (or any name you like provide it ends in .htm) and double click on it in Windows (or Winnt) Explorer and see what it does. You must click OK to close the box. Pressiing F5 (see last tutorial) and will bring it back. Click OK and close the window in the usual way. Simple isn't it? You can display any word or words up to a limit of 255 characters provided it is written bewtween the quotes. Punctuation can also be displayed again provided it is between the quotes.
However, unlike VBScript, the alert function is NOT capable of any extra functions. You cannot display a different icon nor can you specify a title for the box (another reason to like VBScript).
From now on, I'll just be printing the code between the comments and the --> tag. I'll leave it up to you to paste the code between the tags and save it with a relevent name. Take alook at this.
Now we can communicate with the user but very often, the user needs to give the program some kind of input. This is where the prompt function comes in. This is how it looks.
var myInput;
myInput=prompt('Hello');
The VAR statement is telling Javascript
that a variable containing a value is going to be used.
No type is assigned although it is assoumed from the
context. Javascript (unlike VBScript) has several types
of variable but this falls outside the scope of this
tutorial.
This code produces a box which the user can type into. It has a message telling the user what kind of input is required. Once the text has been entered, the user can either click OK (or press the Return key) to pass the value to the program and closes the box or click Cancel which simply closes the box. This example passes a value back but nothing is actually done with it. However, the following is a more useful program.
var myInput;
myInput=prompt("Please enter your name",'name');
alert('Hello ' + myInput);
This time, the input box has a prompt and a default entry
in the text field which can be deleted with a single
keypress or accepted and asks the user to enter his/her
name. This is then passed to a message box using the
variable MyInput which is then displayed
along with a simple greeting. The +
joins two strings together. Note the space after the word
hello to make the display look better.
That completes this second tutorial. We'll get into something a little meatier next time.
Please eMail me at: nickjc@nickjc.co.uk