Доступ к атрибутам из кнопки вызова Magnific Popup при загрузке Popup

У меня есть страница с несколькими кнопками, которые открывают один и тот же модальный режим с помощью Magnific Popup. Однако мне нужно настроить всплывающее окно для каждой кнопки в соответствии с атрибутами данных вызывающей кнопки.

Поэтому мне нужен способ вызова функции, когда всплывающее окно появляется :-) и имеет доступ к вызывающей кнопке.

Первоначальная инициализация всплывающих окон является частью файла js FE, и я работаю в файле js модуля. Поэтому я пытаюсь свести к минимуму изменения в js FE!

Это возможно? Как я могу это достичь?

javascript,jquery,magnific-popup,

0

Ответов: 1

0 принят

ПРОВЕРИТЬ ОБНОВЛЕНИЕ НИЖЕ:

Это то, что я сделал:

  • Не касался FE-файлов FE, которые инициализировали любой .my-modalкласс
  • Я редактировал классы этих кнопок из .my-modalв .my-custom-modal(например)

  • Инициализированная функция magnificpopup .my-custom-modalвключена и добавила следующее для запуска события перед открытием модального:

    $('.my-custom-modal').magnificPopup({
    type: 'inline',
    midClick: true
}).on('mfpBeforeOpen', function () {
    // 'this' is the current button that triggered the modal
    console.log(this);
});

ОБНОВЛЕНИЕ Вышеупомянутое работает, но «этот» var не возвращал фактическую кнопку, но кажется первой кнопкой на странице. Нижеследующее должно работать правильно:

$('.my-custom-modal').magnificPopup({
type: 'inline',
midClick: true,
callbacks: {
            open: function () {
                var mp = $.magnificPopup.instance,
                    btn = $(mp.currItem.el[0]);

                //btn is the actual button being clicked
                console.log(btn);
            }
          }
});
JavaScript, JQuery, Magnific-всплывающее окно,
Похожие вопросы
Яндекс.Метрика