JavaScript window.open() — відкрити нове вікно або вкладку

Метод window.open() відкриває нову вкладку або вікно й повертає посилання на нього.

правити

Загальний опис

Головне, що треба знати: браузер заблокує виклик, якщо той стався не у відповідь на дію користувача. Відкрити вікно з setTimeout чи після await не вийде — і це не баг, а захист від спливаючої реклами.

Друге — безпека. Відкрита сторінка отримує посилання на твою через window.opener і може підмінити її вміст (фішинг). Тому в параметрах завжди варто передавати noopener.

Повертає null, якщо вікно заблоковано — за цим можна відловити блокувальник і чесно сказати користувачу, що робити.

правити

Нотатка

Виклик поза обробником дії користувача не спрацює: браузер його заріже. Це стосується й коду після await — контекст «дії користувача» до того моменту вже втрачено.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	3	12	4

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1*

Приклади

+ запропонувати свій приклад у пісочниці

<button id="open">Відкрити довідник</button>

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);