JS властивість Object.closed

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

Властивість closed об'єкта Window у JavaScript надає можливість перевірити, чи було закрите вікно браузера або вкладка. Ця властивість повертає булеве значення: true, якщо вікно закрите, і false – якщо воно відкрите. Властивість closed є часто використовуваною для управління взаємодією між батьківськими та дочірніми вікнами, дозволяючи розробникам відстежувати стан цих вікон та відповідно реагувати на їх зміну.

Основна корисність властивості closed полягає у можливості перевірки статусу вікна без необхідності виклику виняткових методів або ведення додаткового статусу вікна. Це особливо важливо у сценаріях, де потрібно забезпечити взаємодію між вікнами, наприклад, при роботі з вікнами-спливаючими діалогами (pop-ups) або при створенні складних користувацьких інтерфейсів, що використовують кілька вікон.

Використання властивості closed

1. Базове використання: Найпростіший спосіб використати властивість closed - перевірити статус вікна після його відкриття за допомогою window.open(). Припустимо, ви відкрили нове вікно і хочете перевірити, чи користувач його закрив.

let newWindow = window.open("https://example.com", "_blank");
if (newWindow.closed) {
		console.log("Вікно було закрите.");
} else {
		console.log("Вікно ще відкрите.");
}

У цьому прикладі, після спроби відкриття вікна, виконується перевірка його статусу.

1. Перевірка стану вікна у реальному часі: Можна використовувати setInterval для періодичної перевірки статусу вікна. Це може бути корисно, коли потрібно виконати деякі дії в батьківському вікні, як тільки дочірнє вікно буде закрите.

let newWindow = window.open("https://example.com", "_blank");
let checkInterval = setInterval(() => {
		if (newWindow.closed) {
				console.log("Вікно було закрите.");
				clearInterval(checkInterval);
		}
}, 1000);

У цьому прикладі код регулярно (кожну секунду) перевіряє статус вікна та виводить повідомлення, коли вікно закрите.

1. Комбінування з іншими подіями та методами: Властивість closed може використовуватися разом з іншими подіями та методами для створення складніших інтерактивних сценаріїв. Наприклад, вона може бути комбінована з подією beforeunload для запиту підтвердження від користувача перед закриттям вікна.

let newWindow = window.open("https://example.com", "_blank");
newWindow.onbeforeunload = function() {
		return "Ви впевнені, що хочете закрити це вікно?";
};

// Перевірка статусу вікна
if (newWindow.closed) {
		console.log("Вікно було закрите.");
}

У цілому, властивість closed відіграє ключову роль у визначенні статусу вікон у браузері, даючи можливість розробникам керувати взаємодією між вікнами на веб-сторінках. Використовуючи цю властивість, розробники можуть підвищити інтерактивність та користувацький досвід, а також запобігти можливим проблемам у взаємодії з вікнами.

Синтаксис

closed

Значення

Return

Переглядачі

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

Приклади

• Приклад 1
• Приклад 2
• Приклад 3

// Відкриття нового вікна
let newWindow = window.open("https://example.com");

// Перевірка, чи вікно закрите
if (newWindow.closed) {
    console.log("Вікно закрите.");
} else {
    console.log("Вікно ще відкрите.");
}

// Відкриття нового вікна
let childWindow = window.open("https://example.com");

// Функція для перевірки стану вікна
function checkWindowStatus() {
    if (childWindow.closed) {
        console.log("Дочірнє вікно закрите.");
        clearInterval(intervalId); // Зупинка таймера
    } else {
        console.log("Дочірнє вікно все ще відкрите.");
    }
}

// Періодична перевірка кожні 5 секунд
let intervalId = setInterval(checkWindowStatus, 5000);