JavaScript permette di creare goccia dinamica (pull) menu. Codice JavaScript è normalmente racchiuso direttamente nel documento html che rimuove la necessità di due file, uno per il documento html e uno per lo script. Il codice JavaScript può essere trovato ovunque nel documento, ma viene spesso inserito nella sezione head. Il codice viene quindi chiamato nel corpo del documento.

Codice JavaScript

Lo script incluso in questo articolo verrà creato un elenco a discesa che porterà l'utente ad una nuova pagina web, non appena l'opzione è selezionata.

La prima funzione creerà una matrice.

funzione CreateArray)
{var arg = createArray.arguments
VAI
per (var i = 0; i < arg.length; i + +)
{Questo [i] = arg [i];}
This. length = arg.length
VAI
}

Quindi si riempirà la matrice con l'indirizzo web (URL) per voci di menu. Se avete più di un menu in una pagina web, è possibile creare più di una matrice.

var url = new createArray (
\ "\ http://yahoo.com & quot;
\ "\ http://google.com & quot;
\ "\ http://msn.com & quot;
\ "\ http://facebook.com & quot;
\ "http://myspace.com \ & quot;)
VAI

La funzione JavaScript finale si aprirà l'opzione di menu nella stessa finestra della pagina corrente.

funzione openURL(which)
{m = which.selectedIndex;
URL = URL [m]
VAI
location. href = URL; }

Le voci di menu ognuno avrà un numero di indice. Questo numero viene fatto riferimento nell'istruzione "m=which.selectedIndex". Il numero di indice viene utilizzato nel "URL = URL [m]" dichiarazione che ottiene l'URL corretto dalla matrice. L'istruzione a "location.href=URL" indica al browser per andare al nuovo sito web.

Documento HTML

Il codice JavaScript viene inserito all'interno degli elementi script nella sezione head del documento HTML. È inoltre consigliabile racchiudere il codice all'interno di un commento in modo che esso non verrà letto da browser che non supportano lo scripting.

< Head >
< SCRIPT LANGUAGE = \ "JavaScript\" ><!...
Codice JavaScript
-->
< / SCRIPT >
< / head >

La forma reale viene creata all'interno della sezione del corpo del documento. Viene creato con l'elemento select e i nomi dei siti web si svolgono all'interno degli elementi di opzione. Non si aggiunge gli indirizzi web come valori per l'elemento di opzione come si svolgono nella matrice creata in precedenza.

< body >
< nome modulo = \ "Form\" >
< select nome = \ "menu \" onChange = \"openURL () \" >
< opzione > Yahoo < / option >
< opzione > Google < / option >
< opzione > MSN < / option >
< opzione > Facebook < / option >
< opzione > MySpace < / option >
< / selezionare >
< / form >
< / body >

È possibile aggiungere più funzionalità aggiungendo gli eventi del mouse per creare menu a scorrimento. È inoltre possibile aggiungere altri menu aggiungendo un numero alla variabile di matrice e quindi passando quel numero per la funzione di "openURL()".