Funzioni. La sintassi generale di una funzione è:

Post on 02-May-2015

222 views 3 download

Transcript of Funzioni. La sintassi generale di una funzione è:

FunzioniFunzioni

La sintassi generale di una

funzione è:

function functionname(variable1, variable2,..., variableX){ // Qui vanno le righe di javascript per la funzione}

I caratteri { e } indicano l'inizio e la fine della

funzione.

Un tipico errore nell'inserimento delle funzioni javascript consiste nel tralasciare

l'importanza delle lettere maiuscole.

La parola function si deve scrivere esattamente function. Function oppure FUNCTION

sono considerati errati.

Oltretutto, l'uso delle maiuscole è

importante anche nel nome della funzione.

Se si ha una funzione chiamata myfunction(),

sarebbe un errore riferirsi ad essa come

Myfunction(), MYFUNCTION() oppure MyFunction().

EVENTI

Gli eventi sono delle azioni che possono

essere identificate da javascript.

Un esempio potrebbe essere l'evento onMouseOver, che viene messo in atto

quando l'utente fa scorrere il mouse su un oggetto.

Un altro evento è onLoad,

che viene messo in atto appena la pagina è stata completamente caricata.

Normalmente gli eventi sono usati in

combinazione con le funzioni, in modo che la funzione possa partire

solo al momento in cui si verifica l'evento.

Un esempio è la funzione in grado dianimare un bottone.

La funzione semplicemente

alterna due immagini.

Un' immagine che mostra il bottone nella

posizione "su", e un'altra immagine che mostra il bottone nella posizione

"giù".

Se questa funzione viene richiamata usando l'evento

onMouseOver, si vedrà il bottone premuto quando il mouse scorrerà sull'immagine del bottone

stesso.

Ecco una lista dei più importanti eventi riconosciuti da

javascript:

Evento Si verifica quando tag HTML

onFocus="" Il form field è messo a fuoco select, text, textarea

onBlur="" Il form field perde fuoco select, text, textarea

onChange="" Il contenuto di un field cambia select, text, textarea

onSelect="" Un testo è selezionato text, textarea

onMouseOver=""

Il mouse scorre su un link A

onMouseOut=""Il mouse scorre al di fuori di un link A

onClick="" Il mouse clicca su un oggettoA, button, checkbox, radio, reset, submit

onLoad="" La pagina è completamente caricata body, frameset

onUnload="" Il browser apre un nuovo documento body, frameset

onSubmit="" Il bottone di invio viene cliccato form

Gli eventi si usano per due scopi

principali:

•Per far partire una funzione nel momento

in cui l'evento viene decifrato

Per mostrare una casella sullo schermo nel

momento in cui l'evento viene

decifrato

Ecco una breve descrizione degli scopi principali di

ogni evento:

onFocus, onBlur e onChange vengono usati soprattutto in

combinazione con la convalida dei form field.

Poniamo che tu abbia una funzione chiamata

validateEmail() con il compito di verificare se un

indirizzo email inserito possiede il simbolo @, e se in

coda ha una sigla riconoscibile, come "com",

"net", ecc.

. In più, supponiamo che l'utente possa

inserire il suo indirizzo email in un

form.

Dovresti allora usare l'evento onChange per richiamare la

funzione ogni volta che l'utente cambia il

contenuto del field:

<input type="text" size="20" onChange="validateEmail()">;

onLoad e onUnload sono usati soprattutto per

le caselle che sbucano sullo schermo ("popups") quando il visitatore entra in una pagina o ne esce.

Un altro modo di usarli è in combinazione con i

cookie che vanno sistemati all'ingresso o

all'uscita delle tue pagine.

Per esempio, potresti avere un popup che domanda al visitatore di inserire il suo

nome al suo primo ingresso nella tua pagina.

Il nome viene quindi

memorizzato in un cookie.

. In più, quando il visitatore lascia la tua

pagina, un cookie memorizza la data

corrente.

La volta successiva che il visitatore arriverà nella tua

pagina, ci sarà un altro popup che dirà una cosa del genere:

"Benvenuto, Bill Clinton, questa pagina non è stata aggiornata dalla tua ultima

visita 8 giorni fa".

Un altro uso comune degli eventi onLoad e onUnload è per la creazione di pagine che

hanno la funzione assai irritante di aprire

immediatamente un sacco di altre finestre appena si entra

nella pagina.

Questo è un comportamento

improprio nel "galateo delle rete", e non viene considerato come corretto web

design.

onSubmit viene usato per uno

scopo principale: convalidare tutti i field all'interno di un form

prima di inviarlo realmente.

Nell'esempio che abbiamo riportato per onChange, abbiamo mostrato come si fa a

convalidare un singolo form field.

Alcune volte però, il visitatore può infastidirsi

se viene interrotto da convalide mentre

inserisce i field in un form.

Piuttosto che aspettare la convalida per ogni singolo

input, potresti scegliere di far approvare il form nel

momento in cui viene cliccato il tasto dell'invio.

Questo si può fare usando

l'evento onSubmit

Supponiamo che tu costruisca una funzione

chiamata checkform()

in grado di convalidare le entrate in un form.

Supponiamo anche che tu voglia far partire questa funzione nel

momento in cui l'utente clicca sul tasto d'invio.

Se il contenuto non viene accettato dalla tua funzione, questo

verrà cancellato

. In questo modo verranno inviati

soltanto contenuti approvati dalla

funzione.

Per ottenere tutto questo devi solo: inserire un evento onSubmit al tag <form> in questo

modo:

<form method="yourchoice" action="yourchoice"

onsubmit="return checkform()">

La funzione checkform()

risponde true (vero), oppure false (falso).

Se risponde true

l'invio avrà luogo.

Se risponde false

l'invio sarà annullato.