Metodo Window open()

Definizione e uso

open() Il metodo aprirà una nuova finestra del browser o una nuova scheda, a seconda delle impostazioni del browser e dei valori dei parametri.

Vedi anche:

Metodo close()

Esempio

Esempio 1

Apri "www.codew3c.com" in una nuova scheda del browser:

window.open("https://www.codew3c.com");

Prova personalmente

Più esempi sono disponibili nella pagina sottostante.

Sintassi

window.open(url, name, features, replace)

Parametro

Parametro Descrizione
url

Opzionale. URL della pagina da aprire.

Se non specificato url, aprirà una nuova finestra o scheda vuota.

name Opzionale. Proprietà target o nome della finestra.
features Opzionale. Elenco di elementi separati da virgola, senza spazi.
replace

Disabilitato.

Determina se creare una nuova voce o sostituire il documento corrente nella lista degli storici dell'URL.

Supporta i seguenti valori:

  • true - Sostituisce il documento corrente nella lista degli storici dell'URL
  • false - Crea una nuova voce nella lista degli storici dell'URL

Attenzione:Chrome utilizza replace L'uso del parametro farà scattare un'eccezione.

Il parametro name supporta i seguenti valori:

Valore Descrizione
_blank L'URL viene caricato in una nuova finestra o scheda. Predefinito.
_parent L'URL viene caricato nel frame padre.
_self Sostituisci l'URL nella pagina corrente.
_top Sostituisci qualsiasi set di frame che potrebbe essere caricato.
name Il nome della finestra (non specifica il titolo della finestra).

Il parametro features supporta i seguenti valori:

Valore Descrizione
fullscreen=yes|no|1|0 Se visualizzare il browser in modalità a schermo intero. Predefinito è no. Le finestre in modalità a schermo intero devono essere anche in modalità cinema. Solo per IE.
height=pixels L'altezza della finestra, in pixel. Il valore minimo è 100.
left=pixels La posizione sinistra della finestra (coordinate X), in pixel. Non sono ammessi valori negativi.
location=yes|no|1|0 Se visualizzare il campo dell'indirizzo. Solo per Opera.
menubar=yes|no|1|0 Se visualizzare la barra dei menu.
resizable=yes|no|1|0 Se la finestra può essere ridimensionata. Solo per IE.
scrollbars=yes|no|1|0 Se visualizzare le barre di scorrimento. Solo per IE, Firefox e Opera.
status=yes|no|1|0 Se aggiungere la barra di stato.
titlebar=yes|no|1|0 Se visualizzare la barra dei titoli. Tranne se l'applicazione chiamata è un'applicazione HTML o un dialogo fidato, altrimenti viene ignorato.
toolbar=yes|no|1|0 Se visualizzare la barra degli strumenti del browser. Solo per IE e Firefox.
top=pixels La posizione superiore della finestra (coordinate Y), in pixel. Non sono ammessi valori negativi.
width=pixels L'ampiezza della finestra, in pixel. Il valore minimo è 100.

Valore di ritorno

restituisce un riferimento alla nuova finestra del browser, se il chiamato fallisce, restituisce null.

Dettagli tecnici

Descrizione

open() Il metodo cerca una finestra esistente o apre una nuova finestra del browser. Se name se specificato, restituisce un riferimento alla finestra esistente. La finestra restituita visualizzerà url parametro specifica il documento, ma ignora features parametro. Solo conoscendo il nome della finestra, è l'unico modo in cui JavaScript può ottenere un riferimento a quella finestra.

Se non specificato name parametro, o se la finestra specificata non esiste, allora open() Il metodo crea una nuova finestra del browser. Questa nuova finestra visualizzerà url parametro specifica l'URL, il cui nome è name Se specificato, dimensione e controlli sono determinati dal features parametro specifica. url se è una stringa vuota, allora open() apre una nuova finestra.

name parametro specifica il nome della nuova finestra. Questo nome può contenere solo numeri, lettere o trattini. Può essere utilizzato come etichetta <a> e <form> del valore dell'attributo target, per costringere la visualizzazione del documento in questa finestra specificata.

Utilizzando il metodo Window.open() Quando si carica un nuovo documento in una finestra esistente specificata, è possibile passargli replace parametro, utilizzato per dichiarare se il nuovo documento dovrebbe avere la propria voce nella cronologia di navigazione della finestra o sostituire la voce corrente. Se replace se il valore è true, il nuovo documento sostituirà il documento esistente. Se il valore è false o omesso, il nuovo documento avrà la propria voce nella cronologia di navigazione della finestra. La funzione fornita da questo parametro è simile a Location.replace() metodo funzionalità fornite

Non confondere Window.open() Il metodo è simile Document.open() metodo, per rendere il tuo codice chiaro e comprensibile, meglio utilizzare Window.open(), non utilizzare open(). Nel contesto di un gestore di eventi definito come proprietà HTML, di solito si interpreta la funzione open() come Document.open()pertanto, in questo caso, è necessario utilizzare Window.open().

Proprietà finestra

features il parametro è la lista delle proprietà che la finestra deve visualizzare, separate da virgola. Se il valore di questo parametro opzionale è vuoto o omesso, la finestra visualizzerà tutte le proprietà. Tuttavia, se features specificano una proprietà, allora le proprietà non elencate in questa lista non verranno visualizzate nella finestra. È importante notare che questa stringa non contiene spazi o spazi bianchi, e ogni elemento è formato come segue:

feature[=value]

Per la maggior parte delle proprietà,value Il valore è yes o no. Dopo queste proprietà, l'uguale e value I valori possono essere omessi, se viene specificata la proprietà, si assume il valore value Il valore è yes, se non viene specificato, si assume value Il valore è no. Tuttavia, se non viene specificato il valore della proprietà width o height value Il valore è obbligatorio, assicurati di specificare i valori in pixel.

Supporto browser

Tutti i browser supportano open():

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Supporto Supporto Supporto Supporto Supporto Supporto

Altri esempi

Esempio 2

Apri la pagina about:blank nella nuova finestra/scheda:

var myWindow = window.open("", "", "width=200,height=100");

Prova personalmente

Esempio 3

Apri una nuova finestra denominata "MsgWindow" e scrivi alcuni testi al suo interno:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>This is 'MsgWindow'. I am 200px wide and 100px tall!</p>");

Prova personalmente

Esempio 4

Sostituisci la finestra corrente con una nuova finestra:

var myWindow = window.open("", "_self");
myWindow.document.write("<p>Ho sostituito la finestra corrente.</p>")}

Prova personalmente

Esempio 5

Apertura di una nuova finestra e controllo dell'aspetto:

window.open("https://www.codew3c.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");

Prova personalmente

Esempio 6

Apertura di più schede:

window.open("http://www.google.com/");
window.open("https://www.codew3c.com/");

Prova personalmente

Esempio 7

Apertura di una nuova finestra. Poi utilizzare close() per chiudere questa nuova finestra:

function openWin() {
  myWindow = window.open("", "myWindow", "width=200,height=100");   // Apertura della nuova finestra
}
function closeWin() {
  myWindow.close();   // Chiusura di questa nuova finestra
}

Prova personalmente

Esempio 8

Apertura di una nuova finestra. Utilizzare l'attributo name per ottenere il nome della nuova finestra:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>Il nome di questa finestra è: " + myWindow.name + "</p>");

Prova personalmente

Esempio 9

Utilizzare l'attributo opener per ottenere il riferimento alla finestra che ha creato la nuova finestra:

var myWindow = window.open("", "myWindow", "width=200,height=100");   // Apertura della nuova finestra
myWindow.document.write("<p>Questo è 'myWindow'</p>");   // Testo nella nuova finestra
myWindow.opener.document.write("<p>Questo è la finestra sorgente!</p>");  // Testo nella finestra creata

Prova personalmente