Как загрузить содержимое подписи Fancybox с помощью Ajax?

Question

Я хочу показать некоторую информацию в виде HTML в заголовке Fancybox.

Эта информация загружается рядом с изображением в виде HTML-элемента с помощью ajax.

До сих пор у меня был метод afterload, который загружал содержимое заголовка из этого HTML-элемента в заголовок, отсоединив его и добавив в заголовок после загрузки ajax.

afterLoad : function (instance, slide) {
                 $( ".fancybox-slide--current .caption-content" ).detach()
                 .appendTo( ".fancybox-caption" );
            }

Это обходной путь, который я использовал, есть ли более чистый способ сделать это?

Answer 1

Я не уверен, что понимаю вас, но думаю, вы ищете способ правильно обновить подпись. Вот демо, вы можете настроить его, чтобы использовать ajax:

$('[data-fancybox="images"]').fancybox({

  afterLoad: function(instance, current) {

    if (instance.group[ current.index ].isProcessed !== true ) {

      setTimeout(function() {
        if ( !instance.isClosing ) {
          var caption = 'Another caption for #' + (current.index + 1);

          // Set caption permanently for current group item
          instance.group[ current.index ].opts.caption = caption;

          // Set caption for current slide object
          current.opts.caption = caption;

          // Update caption HTML element
          instance.updateControls();

          // Do this only once
          instance.group[ current.index ].isProcessed = true;
        }

      }, 3000);
    }
  }
});

https://codepen.io/anon/pen/RyGZZE?editors=1010