JavaScript window.open() — відкрити нове вікно або вкладку
Метод window.open() відкриває нову вкладку або вікно й повертає посилання на нього.
Загальний опис
Головне, що треба знати: браузер заблокує виклик, якщо той стався не у відповідь на дію користувача. Відкрити вікно з setTimeout чи після await не вийде — і це не баг, а захист від спливаючої реклами.
Друге — безпека. Відкрита сторінка отримує посилання на твою через window.opener і може підмінити її вміст (фішинг). Тому в параметрах завжди варто передавати noopener.
Повертає null, якщо вікно заблоковано — за цим можна відловити блокувальник і чесно сказати користувачу, що робити.
- Нотатка
-
Виклик поза обробником дії користувача не спрацює: браузер його заріже. Це стосується й коду після
автор: NagarDawait— контекст «дії користувача» до того моменту вже втрачено.
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| open | 1+ | 1+ | 1+ | 3+ | 12+ | 5+ |
| Переглядач | ||||
|---|---|---|---|---|
| open | yes | yes | yes | yes |
Приклади
+ запропонувати свій приклад у пісочниці
Відкриття з noopener і перевіркою на блокувальник.
HTML
<button id="open">Відкрити довідник</button>
JS
document.getElementById('open').addEventListener('click', () => {
// noopener: нова сторінка не отримає доступу до нашої
const win = window.open('https://css.in.ua', '_blank', 'noopener');
if (win === null) {
alert('Схоже, спливаючі вікна заблоковано');
}
});
// а так НЕ спрацює — браузер заріже:
// setTimeout(() => window.open('/page'), 1000);
Коментарі
Коментарів ще немає — будьте першим!