JavaScript oferuje wbudowane metody otwierania i zamykania okna przeglądarki w celu wykonywania dodatkowych operacji, takich jak okno robota itp. Metody te pomagają otwierać lub zamykać wyskakujące okna przeglądarki. Poniżej przedstawiono metody okien:

otwarty() zamknąć()

The okno.otwarte metoda służy do otwierania nowej strony internetowej w nowym oknie i okno.zamknij metoda zamykania strony internetowej otwartej metodą window.open. Zobacz szczegółowo metodę window.open() :

Okno.otwórz()

Jest to predefiniowana metoda okna JavaScript używany do otwierania nowej karty lub okna w przeglądarce. Będzie to zależeć od ustawień Twojej przeglądarki lub parametrów przekazanych w metodzie window.open(), która spowoduje otwarcie nowego okna lub nowej karty.

Ta metoda jest obsługiwana przez prawie wszystkie popularne przeglądarki internetowe, takie jak Chrome, Firefoksa itp. Poniżej znajduje się składnia i parametry metody otwierania okna -

Składnia

Ta funkcja akceptuje cztery parametry, ale są one opcjonalne.

 window.open(URL, name, specs, replace); 

Lub

Funkcji tej można także używać bez użycia przycisku okno słowo kluczowe jak pokazano poniżej:

 open(URL, name, specs, replace) 

Nie ma różnicy między obiema składniami.

Lista parametrów

Poniżej znajduje się lista parametrów metody window.open(). Pamiętaj, że - wszystkie parametry tej metody są opcjonalne i działają inaczej.

Adres URL: Ten opcjonalny parametr funkcji window.open() zawiera ciąg adresu URL strony internetowej, którą chcesz otworzyć. Jeśli w tej funkcji nie określisz żadnego adresu URL, otworzy się nowe puste okno ( o:puste ).

nazwa: Za pomocą tego parametru możesz ustawić nazwę okna, które zamierzasz otworzyć. Obsługuje następujące wartości:

Powyższe wartości przekazywane są w pojedynczym lub podwójnym cudzysłowie do funkcji window.open() w miejscu parametru name.

okular: Ten parametr zawiera ustawienia oddzielone przecinkiem. Element użyty w tym parametrze nie może posiadać spacji, np. szerokość=150, wysokość=100 .

Obsługuje kilka wartości.

zastępować: Podobnie jak inne parametry metody window.open(), jest to również parametr opcjonalny. Tworzy nowy wpis lub zastępuje bieżący wpis na liście historii. Obsługuje dwie wartości logiczne; oznacza to, że zwraca wartość true lub false:

Zwracane wartości

Zwróci nowo otwarte okno.

Przykłady

Oto kilka przykładów funkcji window.open() umożliwiającej otwarcie okna/karty przeglądarki. Domyślnie określony adres URL otwiera się w nowej karcie lub oknie. Zobacz przykłady poniżej:

1. open() z parametrem URL

To jest prosty przykład metody otwierania okna zawierającej adres URL witryny internetowej. Użyliśmy przycisku. Klikając na ten przycisk, metoda window.open() wywoła i otworzy stronę w nowej karcie przeglądarki.

Skopiuj kod

 Click the button to open new window <br> <br> Open Window 

Lub

Kod ten można zapisać w sposób podany poniżej -

równa się metodzie Java

Skopiuj kod

 function openWindow() { window.open(&apos;https://www.javatpoint.com&apos;); } Click the button to open new window <br> <br> Open Window 

Wyjście

Kiedy na to klikniesz Otwórz okno przycisk, witryna javatpoint otworzy się w nowej karcie w tym samym oknie.

Zobacz zrzut ekranu poniżej:

2. open() bez parametrów

W tym przykładzie nie będziemy przekazywać żadnego parametru do funkcji window.open(), dzięki czemu nowa karta otworzy się w poprzednim oknie.

Skopiuj kod

 function openWindow() { window.open(); } Click the button to open new window <br> <br> Open Window 

Wyjście

Gdy wykonasz powyższy kod, pojawi się przy nim przycisk.

Kiedy to klikniesz Otwórz okno przycisk, otworzy się puste okno w nowej karcie.

3. open() z parametrami nazw

W tym przykładzie określimy _rodzic w parametrze nazwa. Możesz przekazać w nim dowolną z tych wartości (_parent, _blank, _top itp.).

Skopiuj kod

 function openWindow() { window.open(&apos;https://gmail.com&apos;, &apos;_parent&apos;); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window 

Wyjście

Wykonaj kod i uzyskaj wynik, jak podano poniżej. Będzie zawierać przycisk umożliwiający kliknięcie i otwarcie nowego adresu URL w tym samym oknie nadrzędnym.

Po kliknięciu tego przycisku Gmail otworzy się w tym samym oknie nadrzędnym.

Kiedy przekażesz różne wartości w drugim parametrze, zobaczysz różnicę dla różnych wartości.

4. Określ rozmiar nowego okna

W tym przykładzie określimy wysokość i szerokość nowego okna. W tym celu użyjemy trzeciego parametru ( okular ) w metodzie window.open() i przekaż do tej funkcji wysokość i szerokość okna oddzielone przecinkiem. Okno otworzy się w określonym rozmiarze.

Skopiuj kod

 function openWindow() { window.open(&apos;&apos;, &apos;&apos;, &apos;width=300,height=200&apos;); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window 

Wyjście

Wykonaj powyższy kod i uzyskaj wynik jak podano poniżej. Będzie zawierać przycisk umożliwiający kliknięcie i otwarcie nowego adresu URL w tym samym oknie nadrzędnym.

Kliknięcie tego przycisku spowoduje otwarcie nowego, pustego okna pod oknem nadrzędnym o rozmiarze.

Pamiętaj, że możesz także przekazać adres URL do metody window.open(), aby otworzyć dowolną witrynę internetową.

Otwórz nowe okno z nazwą i wiadomością

W nowym oknie, które otworzymy po kliknięciu przycisku, możemy wyświetlić dowolny zdefiniowany przez użytkownika tekst lub formularz. W tym celu musimy nadać nowemu oknu dowolną nazwę i wpisać w nią jakiś tekst. Nazwa ta zostanie przekazana do metody window.open(). Zobacz poniższy kod, jak zostanie zaimplementowany z rzeczywistym kodowaniem.

Skopiuj kod

 function openWindow() { var newtab = window.open(&apos;&apos;, &apos;anotherWindow&apos;, &apos;width=300,height=150&apos;); newtab.document.write(&apos;<p> This is &apos;anotherWindow&apos;. It is 300px wide and 150px tall new window! </p>&apos;); } <b> Click the button to open the new user-defined sized window </b> <br> <br> Open Window 

Wyjście

Wykonaj kod i uzyskaj wynik, jak podano poniżej. Będzie zawierał przycisk umożliwiający kliknięcie i otwarcie nowego adresu URL w tym samym oknie nadrzędnym.

Po kliknięciu tego przycisku otworzy się nowe okno ze zdefiniowanym przez użytkownika komunikatem pod oknem nadrzędnym o rozmiarze 300*150.

JavaScript oferuje również wbudowaną metodę, tj. zamknięcie(), aby zamknąć okno przeglądarki.

Zamknij okno otwarte przez window.open()

W tym przykładzie pokażemy jak zamknąć okno lub kartę otwartą metodą window.open(). Najpierw otworzymy adres URL witryny w nowym oknie (rozmiar określony w kodzie) za pomocą kliknięcia przycisku, a następnie kolejnym przyciskiem zamkniemy otwarte okno. Zobacz poniższy kod, jak to zostanie zrobione:

Skopiuj kod

 Open and close window method example // function to open the new window tab with specified size function windowOpen() { var newWindow = window.open( &apos;https://www.javatpoint.com/&apos;, &apos;_blank&apos;, &apos;width=500, height=350&apos;); } // function to close the window opened by window.open() function windowClose() { newWindow.close(); } <h2> Window open() and close() method </h2> <b> Click the button to open Javatpoint tutorial site </b> <br> Open Javatpoint <br> <br> <b> Click the button to close Javatpoint tutorial site </b> <br> Close Javatpoint 

Wyjście

Kiedy wykonasz kod, otrzymasz odpowiedź jak pokazano poniżej:

Kliknij Otwórz Javapoint przycisk, aby otworzyć stronę internetową z tutorialem Javatpoint. Określiliśmy rozmiar (wysokość i szerokość) nowego wyskakującego okna do otwarcia.

Jeśli klikniesz Zamknij Javatpoint przycisk , otwarte okno zostanie zminimalizowane.

Obsługa przeglądarki

Kilka przeglądarek internetowych obsługuje metodę window.open(), na przykład:

• Chrom
• Mozilla Firefox
• Internet Explorer (IE)
• Opera
• Safari itp.

Możesz używać i uruchamiać metodę window.open() w powyższych przeglądarkach.

Uwaga: Aby zamknąć otwarte okno przeglądarki lub kartę otwartą za pomocą metody window.open(), możesz użyć metody JavaScript JavaScript. Omówimy to bardziej szczegółowo w następnym rozdziale.