In una lezione precedente abbiamo visto che (se ci troviamo all'interno della funzione) abbiamo la possibilità di interrompere il flusso del codice tramite l'utilizzo dell'istruzione return.
Possiamo applicare questa possibilità all'utilizzo dell'if:
- se entriamo in una determinata casistica
- la funzione restituisce i valori
- e, con la restituzione dei valori, il flusso del codice viene interrotto
Ad esempio:
function checkBrowser(){
// se il browsr non è Internet Explorer
if (!document.all) {
alert ("Non stai usando Internet Explorer");
return; // Il codice si interrompe qui
}
alert ("Il tuo browser è Internet Explorer");
nome = prompt("Scrivi il tuo nome","il tuo nome qui");
}
checkBrowser();
Ovviamente il metodo del return funziona soltanto se ci troviamo all'interno di una funzione.
Un'utile applicazione di quanto abbiamo appena visto si ha nella validazione dei form, in cui l'istruzione return può essere utilizzata per interrompere la submit, nel caso in cui i dati non siano nel formato desiderato.
Prima di proseguire, esaminiamo però due istruzioni JavaScript, che abbiamo già accennato nella lezione precedente, e che ci serviranno nel corso dell'esempio:
isNaN(valore): la funzione isNaN() significa "is not a number " (non è un numero) e serve per verificare se un determinato valore non è numerico. Se il valore è numerico restituisce false, in caso contrario restituisce true. La sintassi è:
isNaN(valore)
Ad esempio:
valore=4;
alert(isNaN(valore)); //restituisce false
oppure
valore="ciao mondo";
alert(isNaN(valore)); //restituisce true
È quindi possibile creare un controllo di questo tipo:
if (isNaN(valore)) {
alert ("valore non è un numero");
}
indexOf: è un metodo delle stringhe e si utilizza per verificare se una determinata stringa contiene o meno un determinato testo (ovvero una determinata sottostringa). La sintassi è la seguente:
indexOf(valore)
Se la sottostringa cercata non c'è, il metodo restituisce -1. In tutti gli altri casi restituisce la posizione della sottostringa (la prima posizione è 0).
Il codice è:
miaStringa.indexOf("miaSottoStringa");
Ad esempio:
valore="ciao mondo";
alert(valore.indexOf("mondo")); //restituisce 5
Se la sottostringa esiste all'interno della stringa, il valore restituito da indexOf sarà allora maggiore di -1.
Utilizziamo le istruzioni che abbiamo appena esaminato per costruire un controllo su un modulo di una pagina web. Immaginiamo di avere due campi:
- il primo è l'età
- il secondo è un'e-mail
e ipotizziamo di voler far un controllo sul form tale che se il formato dell'età è numerico e il campo dell'e-mail contiene una chiocciola, il modulo può essere inviato. In caso contrario verrà visualizzato un messaggio di errore e il modulo non partirà. Ecco l'esempio:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script type="text/javascript">
function valida() {
//prendo i valori dei campi, abbreviandone i nomi
eta=dati.eta.value;
email=dati.email.value;
if (isNaN(eta)){
alert ("Inserisci un'età valida");
return false;
}
if (email.indexOf("@")==-1) {
alert ("Inserisci un'email valida");
return false;
}
}
</script>
</head>
<body>
<form name="dati" action="http://www.html.it" onSubmit="return valida();">
<!-notare il return anteposto alla chiamata della funzione-->
La tua età: <input type="text" name="eta"><br/>
La tua e-mail: <input type="text" name="email"><br/>
<input type="submit" value="invia">
</form>
</body>
</html>
Come si può notare ogni volta che si entra in una determinata casistica e compare il return, l'esecuzione del codice si arresta, se invece tutto va bene non viene incontrato nessun return e dunque l'azione del form viene eseguita.
