JavaScript è in grado di generare tre differenti tiplogie di "finestre implicite" (dette anche "finestre incorporate", "finestre modali", o "finestre di dialogo"), che avremo modo di utilizzare più volte nei nostri script (soprattutto l'alert).
Alert
Abbiamo già incontrato l'alert diverse volte nel corso delle nostre lezioni e si tratta senz'altro della finestra che vi capiterà di utilizzare più spesso: l'alert visualizza un avvertimento, un messaggio di errore che blocca qualsiasi azione dell'utente finché egli non dà il suo benestare cliccando sul bottone.
Sintassi di alert()
alert(messaggio)
Il contenuto dell'alert è una stringa (cioè una sequenza di caratteri), il che vuol dire che deve essere racchiuso tra virgolette oppure che deve essere un valore che JavaScript sia in grado di convertire in automatico in un valore letterale (come nel caso dei numeri).
Esempi di alert()
alert("Ecco il messaggio") // messaggio inserito direttamente var messaggio = "Ecco il messaggio"; alert(messaggio); // messaggio inserito tramite variabile
Come per document.write()
, in gererale per le stringhe, se bisogna usare le virgolette all'interno del messaggio è bene che usiate i caratteri di escape (cioè il back-slash), onde evitare errori.
Testo con sequenze di escape
alert("Marco disse "Ciao Mondo!"");
Ecco un esempio di alert:
<a href="http://www.html.it" onClick="alert('Stai per uscire');" target="_blank">testo link</a>
Come si può vedere, finché l'utente non clicca su "ok", la pagina non va verso il link indicato.
Da notare le virgolette ad apice semplice dentro le virgolette ad apice doppio, per evitare di "chiudere prematuramente" il contenuto dell'evento onClick
.
Confirm
È una finestra che pone una domanda e chiede conferma dando la possibilità di scegliere tra due opzioni ("ok" e "annulla").
La sintassi è:
confirm("messaggio");
Mentre l'alert concede una sola possibilità di scelta ("ok"), il confirm dà la possibilità di scegliere tra due opzioni:
<a href="http://www.html.it" onClick="return confirm('Sei sicuro di voler uscire dalla pagina?');" target="_blank">testo link</a>
Prompt
È una finestra che pone una domanda e consente all'utente di dare la risposta che vuole. Può avere anche un valore di risposta predefinito. La sintassi è:
prompt("domanda","risposta predefinita");
la risposta predefinita è facoltativa.Ad esempio:
<body onLoad="prompt('Come ti chiami?');">
o anche:
<body onLoad="prompt('Come ti chiami?','inserisci qui il tuo nome');">
Per visualizzare il nome dell'utente nella pagina dovremo poi "catturarlo" in qualche modo. Vedremo più avanti come fare.
Nota a margine
Nell'ottica in cui abbiamo affrontato il corso finora è bene specificare che in realtà le finestre modali sono metodi dell'oggetto "window".
Quindi la sintassi estesa per visualizzare le finestre modali dovrebbe essere:
window.alert("messaggio"); window.confirm("messaggio"); window.prompt("domanda","risposta predefinita");