JavaScript
Javascript has been one of the most interesting innovation of
the web in recent years. It allows you to make your web pages interactive.
Unlike Java applets, it runs instantly and does not need to be compiled.
The code is just inserted straight into the HTML.
On this page I hope to demonstrate, and give you the source code
for many Javascript uses.
Compatibility: At the moment all these scripts have been
tested in Netscape 3, Netscape 4 & IE4. The pull down menu only
works in version 4 browsers. The email, and pop-up window script
work in Netscape 3, 4 & IE4.
Javascript pull down menu
The first bit goes between the <HEAD> and </HEAD> part
of the page.
<SCRIPT language="JavaScript">
<!--
function surfto(form) {
var myindex=form.select1.selectedIndex
if (form.select1.options[myindex].value != 0) {
location=form.select1.options[myindex].value;}
}
//-->
</SCRIPT>
This goes anywhere on the page where you want the pull down menu
to be.
<FORM NAME="MenuForm">
<SELECT NAME="select1" onChange="surfto(this.form)" SIZE=1>
<OPTION SELECTED VALUE=0> --- Choose A Page ---
<OPTION VALUE="../offtopic/computing.htm">Computing
<OPTION VALUE="../offtopic/entertainment.htm">Entertainment
<OPTION VALUE="../offtopic/contactus.htm">Contact Us
</SELECT>
</FORM>
For a different version of a Java pull down menu see the Java
menu page.
Verify an email address in a form.
This piece of code can be used to verify that someone has supplied
a valid looking email address in your form. It will instantly tell
them to re-enter it when they hit the submit button, if the address
does not seem valid.
To do this bung the following in-between the <HEAD> and </HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkEmail() {
text=document.emailform.email.value;
if (text.indexOf("@")<3){
alert(" This email address seems wrong. Please"
+" check the prefix and '@' sign.");
return false;
}
if ((text.indexOf(".com")<5)&&(text.indexOf(".org")<5)
&&(text.indexOf(".gov")<5)&&(text.indexOf(".net")<5)
&&(text.indexOf(".co.uk")<7)&&(text.indexOf(".nl")<4)
&&(text.indexOf(".mil")<5)&&(text.indexOf(".edu")<5))
{
alert(" This email address seems wrong. Please"
+" check the suffix. (It should include a .com, .edu,"
+" .net, .org, .gov, .co.uk, .nl or .mil)");
return false;
}
return true;
}
//-->
</SCRIPT>
This code will only verify email addresses whose suffixes (the
.co.uk or .com bit) are checked for in the code. If you want the
script to check for more then just add them into the code.
Stick the next code where ever you want the form to appear.
<CENTER>
<FORM NAME="emailform" ACTION="thanks.htm"
onSubmit="return checkEmail()">
<INPUT TYPE="text" NAME="email" SIZE=40 VALUE=""><BR>
<INPUT TYPE="submit" NAME="email1" VALUE="Submit">
</FORM>
</CENTER>
Pop Up Windows
<FORM>
<INPUT TYPE="button" NAME="openwindow" VALUE="Open pop-up"
onClick="return Popup()">
</FORM>
You can open the window with a link
as well.
<A HREF="javascript:Popup()" >You can open the window
with a link as well</A>
The following goes between the <HEAD> and </HEAD>
<SCRIPT language="JavaScript">
<!--
function Popup()
{
var popupURL ="wierd.htm";
var popup = window.open(popupURL,"Popup",
'toolbar=0,location=0,directories=0,status=0,menubar=0,
scrollbars=0,resizable=0,width=630,height=450');
if( navigator.appName.substring(0,8) == "Netscape" )
{
popup.location = popupURL;
}
}
// -->
</SCRIPT>
These attributes can be used in the window.open()command.
Note: The window.open command (shown in red) should
all be on one line. I've split it above to make it fit on the page.
| Attribute |
Options / What it does |
|
toolbar
|
0 - no tool bar
1 - with tool bar
|
|
menubar
|
0 - no menubar
1 - with menubar
|
|
scrollbars
|
0 - no scrollbars
1 - with scrollbars
|
|
location
|
0 - no location bar
1 - with location bar
|
|
directories
|
0 - no directory bar
1 - with directory bar
|
|
status
|
0 - no status bar
1 - with status bar
|
|
width
|
width of the new window
|
|
height
|
height of the new window
|
|