JavaScript пропонує вбудовані методи відкривання та закривання вікна браузера для виконання додаткових операцій, як-от вікно робота тощо. Ці методи допомагають відкривати чи закривати спливаючі вікна браузера. Нижче наведено віконні методи:
The вікно.відкрите метод використовується для відкриття нової веб-сторінки в новому вікні та вікно.закрити метод закриття веб-сторінки, відкритої методом window.open. Докладніше про метод window.open():
Window.open()
Це попередньо визначений віконний метод JavaScript використовується для відкриття нової вкладки або вікна в браузері. Це залежатиме від налаштувань вашого браузера або параметрів, переданих у методі window.open(), які відкриватимуть нове вікно чи вкладку.
Цей метод підтримується майже всіма популярними веб-переглядачами, такими як Chrome, Firefox , тощо. Нижче наведено синтаксис і параметри методу відкриття вікна -
Синтаксис
Ця функція приймає чотири параметри, але вони необов’язкові.
window.open(URL, name, specs, replace);
Або
Ви також можете використовувати цю функцію без використання вікно ключове слово, як показано нижче:
open(URL, name, specs, replace)
Між обома синтаксисами немає різниці.
Список параметрів
Нижче наведено список параметрів методу window.open(). Зауважте, що всі параметри цього методу є необов’язковими та працюють інакше.
URL: Цей додатковий параметр функції window.open() містить рядок URL-адреси веб-сторінки, яку ви хочете відкрити. Якщо ви не вкажете URL-адресу в цій функції, відкриється нове порожнє вікно ( про: порожній ).
ім'я: За допомогою цього параметра ви можете встановити назву вікна, яке ви збираєтеся відкрити. Він підтримує такі значення:
| _blank | Передана URL-адреса завантажиться в нову вкладку/вікно. |
| _батько | URL-адреса завантажиться у батьківське вікно або фрейм, які вже відкриті. |
| _self | Якщо передати цей параметр, URL-адреса замінить попередній вихід, і нове вікно відкриється в тому самому кадрі. |
| _top | URL-адреса замінює будь-який набір фреймів, який можна завантажити. |
| Ім'я | Введіть назву нового вікна, щоб відображати текст або будь-які дані в ньому. (Примітка - не заголовок вікна) |
Вказані вище значення передаються в одинарних або подвійних лапках у функцію window.open() у місці параметра імені.
дискета
характеристики: Цей параметр містить налаштування, розділені комою. Елемент, який використовується в цьому параметрі, не може містити пробіли, наприклад, ширина=150, висота=100 .
Він підтримує кілька значень.
замінити: Як і інші параметри методу window.open(), це також необов’язковий параметр. Він або створює новий запис, або замінює поточний запис у списку історії. Він підтримує два логічних значення; це означає, що він повертає або true, або false:
| Правда | Повертає true, якщо URL-адреса замінює поточний запис або документ у списку історії. |
| помилковий | Повертає false, якщо URL створює новий запис у списку історії. |
Повернуті значення
Він поверне щойно відкрите вікно.
Приклади
Ось кілька прикладів функції window.open() для відкриття вікна/вкладки браузера. За замовчуванням указана URL-адреса відкривається в новій вкладці або вікні. Перегляньте приклади нижче:
1. open() з параметром URL
Це простий приклад методу відкриття вікна з URL-адресою веб-сайту. Ми використали кнопку. Якщо натиснути цю кнопку, метод window.open() викличе та відкриє веб-сайт у новій вкладці браузера.
Копіювати код
Click the button to open new window <br> <br> Open WindowПеревірте зараз
Або
Цей код можна записати, як наведено нижче -
Копіювати код
function openWindow() { window.open('https://www.javatpoint.com'); } Click the button to open new window <br> <br> Open Window Перевірте зараз Вихід
Коли ви натискаєте на це Відкрите вікно кнопку, сайт javatpoint відкриється в новій вкладці в тому самому вікні.
Перегляньте знімок екрана нижче:
2. open() без параметрів
У цьому прикладі ми не передаємо параметри функції window.open(), щоб нова вкладка відкрилася в попередньому вікні.
Копіювати код
function openWindow() { window.open(); } Click the button to open new window <br> <br> Open Window Перевірте зараз Вихід
Коли ви виконаєте наведений вище код, з ним з’явиться кнопка.
Коли ви натискаєте це Відкрите вікно кнопку, у новій вкладці відкриється порожнє вікно.
3. open() з параметрами імені
У цьому прикладі ми вкажемо _батько у параметрі імені. Ви можете передати будь-яке з цих значень (_parent, _blank, _top тощо).
Копіювати код
function openWindow() { window.open('https://gmail.com', '_parent'); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window Перевірте зараз Вихід
Виконайте код і отримайте результат, як наведено нижче. Це міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.
Коли ви натиснете цю кнопку, Gmail відкриється в тому самому батьківському вікні.
Коли ви передасте різні значення в другому параметрі, ви побачите різницю для різних значень.
4. Визначте розмір нового вікна
У цьому прикладі ми вкажемо висоту та ширину для нового вікна. Для цього будемо використовувати третій параметр ( характеристики ) у методі window.open() і передайте цій функції висоту та ширину вікна, розділених комою. Отже, вікно відкриється в заданому розмірі.
Копіювати код
function openWindow() { window.open('', '', 'width=300,height=200'); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window Перевірте зараз Вихід
Виконайте наведений вище код і отримайте результат, як наведено нижче. Це міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.
Коли ви натиснете цю кнопку, під батьківським вікном розміру відкриється нове порожнє вікно.
Зауважте, що ви також можете передати URL методу window.open(), щоб відкрити будь-який веб-сайт.
Відкрийте нове вікно з назвою та повідомленням
Ми можемо показати будь-який визначений користувачем текст або форму в новому вікні, яке ми збираємось відкрити після натискання кнопки. Для цього нам потрібно дати будь-яке ім'я новому вікну і вписати в нього певний текст. Це ім’я буде передано методу window.open(). Подивіться наведений нижче код, як він буде реалізований із фактичним кодуванням.
Копіювати код
function openWindow() { var newtab = window.open('', 'anotherWindow', 'width=300,height=150'); newtab.document.write('<p> This is 'anotherWindow'. It is 300px wide and 150px tall new window! </p>'); } <b> Click the button to open the new user-defined sized window </b> <br> <br> Open Window Перевірте зараз Вихід
Виконайте код і отримайте результат, як наведено нижче. Він міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.
Після натискання цієї кнопки відкриється нове вікно з користувацьким повідомленням під батьківським вікном розміром 300*150.
JavaScript також пропонує вбудований метод, тобто close(), щоб закрити вікно браузера.
Удачі
Закрити вікно, відкрите за допомогою window.open()
У цьому прикладі ми покажемо, як закрити вікно або вкладку, відкриті за допомогою методу window.open(). По-перше, ми відкриємо URL-адресу веб-сайту в новому вікні (розмір, визначений у коді), натиснувши кнопку, а потім використаємо іншу кнопку, щоб закрити відкрите вікно. Подивіться код нижче, як це буде зроблено:
Копіювати код
Open and close window method example // function to open the new window tab with specified size function windowOpen() { var newWindow = window.open( 'https://www.javatpoint.com/', '_blank', 'width=500, height=350'); } // 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 Перевірте зараз Вихід
Коли ви виконаєте код, ви отримаєте відповідь, як показано нижче:
Натисніть на Відкрийте Javatpoint кнопку, щоб відкрити навчальний веб-сайт Javatpoint. Ми вказали розмір (висоту та ширину) нового спливаючого вікна, яке потрібно відкрити.
Якщо натиснути кнопку Закрийте Javatpoint це відкрите вікно буде згорнуто.
Підтримка браузера
Деякі веб-браузери підтримують метод window.open(), наприклад:
- Chrome
- Mozilla Firefox
- Internet Explorer (IE)
- Опера
- Сафарі та ін.
Ви можете використовувати та запускати метод window.open() у наведених вище браузерах.