Закрытие активной вкладки браузера с помощью JavaScript

Быстрый ответ

Для закрытия вкладки, открытой посредством скрипта, в JavaScript используйте функцию window.close(). Этот метод поможет избежать закрытия вкладок, открытых без согласия пользователя:

<button onclick="window.close()">Закрыть вкладку</button>

Обратите внимание, что вкладки, открытые пользователем вручную, не поддаются закрытию даннным методом.

Чтобы получить согласие пользователя, добавьте диалог подтверждения с помощью window.confirm(). Ведь каждому приятно иметь возможность передумать, не так ли?

function closeTab() {
  if (window.confirm("Вам больше не нужна эта вкладка?")) {
    window.close(); // Пока, вкладка!
  }
}

<button onclick="closeTab()">Закрыть вкладку</button>

Понимание механизмов работы браузеров

Шаг подтверждения от пользователя

Используйте диалог подтверждения как стоп-сигнал, чтобы избежать неумышленного закрытия вкладки:

if (window.confirm("Вы уверены, что хотите закрыть эту вкладку?")) {
    window.close(); // До свидания, вкладка
}

Это сродни уверенности "Вы уверены?", перед выполнением необратимых действий.

Подробнее об этом расскажет наш спикер на видео

Особенности работы браузеров

Браузеры имеют свои специфические настройки:

• Firefox: Не позволяет скриптам закрывать вкладки, которые ими не открывались.
• Chrome: Согласно политике Chrome, допускается закрытие только тех вкладок, которые не были последними открытыми.
• Edge: Не ограничивает использование window.close().
• Internet Explorer: Несмотря на то, что Internet Explorer допускает использование window.close(), стоит придерживаться осторожности.

Пользователям Chrome можно попробовать плагин TamperMonkey с заголовком UserScript для расширения возможностей:

// ==UserScript==
// @grant window.close
// ==/UserScript==
// TamperMonkey берёт инициативу в свои руки!

Конфигурационные настройки в Firefox

В Firefox возможно изменить параметры в about:config, чтобы разрешить работу window.close(). Однако не забывайте о ответственности, которая сопутствует расширению функционала!

Использование в локальных приложениях

В локальных приложениях window.close() можно использовать без обычных ограничений безопасности Интернета.

Выход за рамки диалоговых окон 'confirm'

Вместо стандартного confirm() можно использовать более продвинутый пользовательский модальный диалог:

// Встречайте мой модальный диалог
showCustomModal({
  title: "Подтверждение закрытия",
  message: "Вы уверены, что хотите закрыть эту вкладку?",
  onConfirm: function() {
    window.close(); // Мгновенное закрытие
  }
});
// Пользовательские диалоги сочетают в себе эстетику и функциональность

Учет всех возможных параметров

Альтернативы прямому закрытию

Если window.close() не функционирует, можно пробовать следующие варианты:

• Редирект: Направьте пользователя на другую, безопасную страницу или на главную.
• Управление отображением: Скрывайте нежелательные элементы.
• Информирование: Уведомляйте пользователя о временной неработоспособности функции закрытия вкладки.

Всё это позволяет поддерживать необходимый контроль над открытой вкладкой.

Управление вкладками, открытыми через скрипт

Открывая вкладки с помощью window.open(), вы можете контролировать их жизненный цикл:

let newTab = window.open('/myPage', '_blank'); // Вперёд, открываем вкладку!
newTab.close(); // и тут же её закрываем!

Баланс между функциональностью и безопасностью

Помните слова Питера Паркера: "С большой силой приходит большая ответственность". Не рискуйте безопасностью ради обходных путей.

Визуализация

Представьте процесс закрытия вкладки следующим образом:

🖥️ Окно браузера: [📃 Вкладка 1, 📃 Вкладка 2, *📃 Вкладка 3*, 📃 Вкладка 4]

*📃 Вкладка 3*: Вкладка ничего не предполагает о своем будущем.

window.close(); // 👋 Прощай, Вкладка 3!

А теперь в браузере на одну вкладку стало меньше:

🖥️ Окно браузера: [📃 Вкладка 1, 📃 Вкладка 2, 📃 Вкладка 4]

Обратите внимание, что данный метод будет работать только в том случае, если вкладка была открыта именно этим скриптом.