Метод current

Featherlight — это легковесная библиотека для создания модальных окон (lightbox) на JavaScript и jQuery. Одним из важных инструментов для работы с несколькими открытыми или последовательными модальными окнами является метод current. Он предоставляет доступ к текущему экземпляру модального окна, что особенно полезно для управления динамическим контентом и взаимодействия между окнами.

Основное назначение метода current

Метод current возвращает объект текущего активного экземпляра Featherlight. Этот экземпляр содержит все свойства и методы, необходимые для управления модальным окном. В стандартной реализации можно использовать его для:

  • Получения ссылки на DOM-контейнер модального окна.
  • Изменения содержимого текущего окна.
  • Закрытия окна через программный вызов.
  • Взаимодействия с данными, переданными при инициализации.

Синтаксис метода:

$.featherlight.current();

Возвращаемое значение — объект текущего экземпляра, содержащий ключевые свойства:

  • .$instance — jQuery-объект контейнера окна.
  • .content — содержимое модального окна.
  • .close() — метод закрытия окна.
  • .open() — метод повторного открытия окна (редко используется отдельно).
  • .target — элемент, на который ссылается окно.

Получение и работа с текущим окном

Чаще всего current используется для доступа к DOM-элементу окна и последующего изменения его содержимого. Пример:

// Открытие модального окна с текстом
$.featherlight('Привет, мир!');

// Изменение содержимого текущего окна
var currentInstance = $.featherlight.current();
currentInstance.$instance.find('.featherlight-content').html('Новое содержимое');

В этом примере:

  1. Сначала создается новое модальное окно с текстом “Привет, мир!”.
  2. Через метод current получаем активный экземпляр.
  3. С помощью jQuery изменяем HTML-контент окна.

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

Метод current позволяет управлять жизненным циклом модального окна программно:

var instance = $.featherlight.current();

// Проверка существования активного окна
if (instance) {
    instance.close(); // Закрытие текущего окна
}

Проверка на существование экземпляра важна, так как метод возвращает undefined, если модальных окон в данный момент нет.

Использование с галереями и динамическим контентом

При работе с галереями изображений или последовательными окнами current позволяет:

  • Отслеживать, какое окно открыто.
  • Получать информацию о текущем элементе галереи.
  • Динамически подгружать контент без повторного инициализирования Featherlight.

Пример для галереи:

$('a.gallery').featherlightGallery({
    afterOpen: function() {
        var instance = $.featherlight.current();
        console.log('Текущее изображение:', instance.$currentTarget.attr('href'));
    }
});

Здесь current используется для получения ссылки на текущий элемент галереи, что позволяет, например, показывать дополнительную информацию о картинке или логировать действия пользователя.

Методы и свойства экземпляра, доступные через current

Экземпляр, возвращаемый методом current, содержит набор полезных свойств и функций:

Свойство / Метод Описание
.$instance jQuery-объект контейнера окна
.content Текущее содержимое модального окна
.target Элемент, инициировавший окно
.close([event]) Закрытие окна; принимает необязательный объект события
.open([event]) Повторное открытие окна
.beforeOpen(event) Коллбек перед открытием окна
.afterOpen(event) Коллбек после открытия окна
.beforeClose(event) Коллбек перед закрытием окна
.afterClose(event) Коллбек после закрытия окна

Эта структура позволяет строить сложные сценарии взаимодействия, например:

  • Подгрузка данных через AJAX.
  • Плавная анимация изменения содержимого.
  • Синхронизация состояния модального окна с другими элементами страницы.

Особенности работы с несколькими окнами

Featherlight поддерживает стек открытых окон. Метод current всегда возвращает верхнее активное окно, что важно при:

  • Одновременном открытии нескольких модальных окон.
  • Необходимости изменить или закрыть только текущее окно, не затрагивая предыдущие.
  • Отслеживании контекста действия пользователя.

Пример с двумя окнами:

$.featherlight('Первое окно');
$.featherlight('Второе окно');

var topWindow = $.featherlight.current();
topWindow.close(); // Закрывается только "Второе окно"

Первое окно останется открытым, так как current ссылается на верхнее активное окно в стеке.

Рекомендации по использованию

  • current полезен для динамических изменений, но не стоит использовать его для инициализации новых окон — для этого лучше применять стандартные методы $.featherlight().
  • Всегда проверять, что экземпляр существует, чтобы избежать ошибок при закрытии или доступе к DOM.
  • Метод удобен для работы с асинхронным контентом, так как возвращает готовый объект окна с уже смонтированным DOM.

Метод current является центральным инструментом для работы с активными экземплярами Featherlight, обеспечивая полный контроль над модальными окнами без необходимости хранения дополнительных ссылок на них. Он сочетает простоту использования с гибкостью управления содержимым, событиями и жизненным циклом окна.

Оглавление