Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 60 di 112
  • livello avanzato
Indice lezioni

Creare pop-up e finestre di dialogo

Aprire una nuova tab o finestra pop-up e capire le differenze tra i metodi Alert, Confirm e Prompt per utilizzarle al meglio.
Aprire una nuova tab o finestra pop-up e capire le differenze tra i metodi Alert, Confirm e Prompt per utilizzarle al meglio.
Link copiato negli appunti

Alcuni metodi dell'oggetto window sono talmente noti da essere erroneamente considerati funzioni predefinite di JavaScript da parte di diversi sviluppatori.

Tra questi segnaliamo alert(), un metodo che visualizza una finestra modale con un messaggio ed un pulsante OK:

window.alert("Questo è un messaggio");

La grafica e la posizione della finestra di dialogo dipendono dal browser:

Il metodo confirm(), invece, visualizza una finestra modale con un messaggio e due pulsanti: uno per la conferma ed uno per l'annullamento. Il metodo restituisce un valore booleano che rappresenta la conferma da parte dell'utente (true) o l'annullamento (false):

if (window.confirm("Confermi l'eliminazione?")) {
	// ...
}

Il seguente è un esempio di finestra:

Altro metodo di window relativo all'interazione con l'utente è prompt(). Esso richiede l'inserimento di un valore che viene catturato e restituito dal metodo:

var nome = window.prompt("Inserisci il tuo nome");
if (nome != null) {
	// ...
}

Il risultato è analogo quello mostrato dalla seguente figura:

Aprire tab o finestre pop-up

Il metodo open() apre una nuova finestra o tab. Tramite i parametri, tutti opzionali, previsti dal metodo è possibile indicare l'URL della pagina da caricare ed eventuali impostazioni di visualizzazione della finestra. Ad esempio, il seguente codice apre una nuova finestra con l'home page di HTML.it:

window.open("http://www.html.it", "myWindow");

Il secondo parametro indica il nome della finestra, cioè il nome che viene assegnato all'oggetto window creato. È prevista la possibilità di specificare come nome i seguenti valori predefiniti che determinano la modalità di visualizzazione della finestra rispetto alla gerarchia di oggetti window eventualmente esistente:

Campo Descrizione
_blank apre una nuova finestra
_parent sostituisce la finestra o il frame genitore della finestra corrente
_self sostituisce il contenuto della finestra o frame corrente
_top sostituisce il contenuto della radice della gerarchia di oggetti window

È anche possibile specificare un terzo parametro del metodo open() che contiene una stringa di opzioni separate da virgola, come quella mostrata nel seguente esempio:

window.open("http://www.html.it", "myWindow", "menubar=no,toolbar=no,status=no, height=400,width=600,top=150,left=150");

Le opzioni specificate indicano che la nuova finestra non deve avere la barra dei menu, né la barra degli strumenti, né la barra di stato; vengono poi indicate le dimensioni in pixel e la posizione sullo schermo.

Per chiudere una finestra, l'oggetto window mette a disposizione il metodo close().

Ti consigliamo anche