(Site Identification)

'Eye' Focus: Web Support Tutorials

JavaScript: Drop-Menu Example 2

(to Top) Document Header Code

This portion goes in the <head> of the page, without changes: (skip code)

<script language="JavaScript" type="text/javascript"><!--
// original code by Bill Trefzger 12/12/96,
// modified by Melvin Waller Jr 7/1/02
function go(jsm) {
var menujs = eval('document.jsmenu' + jsm + '.jsm' + jsm);
if (menujs.options[menujs.selectedIndex].value != "") {
location = menujs.options[menujs.selectedIndex].value
}} // --></script>

(to Top) Document Body Code

This portion goes in the BODY of the page, changes defined below: (skip code)

<h3><a href="SubjectURL">SubjectTITLE</a></h3>
<script type="text/javascript"><!--
document.write('<form name="jsmenu2" action="javascript:void(null)" method="post">');
document.write('<select name="jsm2">');
document.write('<option value="">SubjectTITLE (choose one)</option>');
document.write('<option value="">--------------------</option>');
document.write('<option value="LinkURL">LinkTITLE</option>');
document.write('<option value="LinkURL">LinkTITLE</option>');
document.write('<option value="LinkURL">LinkTITLE</option>');
document.write('</select><input type="button" value="Go" onclick="go(2)"></form>');
// --></script>

The second portion should then have the following changes made:

First, remember that the 'Subject' of this drop list must have a standard HTML link in this page which goes to another page that lists all of the links presented in this drop list. This link should appear in the page immediately prior to this drop list for proper accessibility.

The 'Link' lines may be repeated as many times as needed.

If multiple lists are to be used in one document then each list must have a unique number. The list's number is specified in 3 places in the script. They are: (skip code)
name="jsmenu#", name="jsm#", and onclick="go(#)"
(where # would be replaced with the list's number).

If the apostrophe character (') must be used in the TITLE or URL of any of these links, then it must be preceded with a back-slash (\') for the JavaScript to work properly without errors.


[Updated: Sunday, November 18, 2007]