如何在beforeShow上设置标题 - Fancybox 3。

Question

我面临的问题，我添加按钮的标题，我需要改变按钮取决于行动，我管理做它与

        caption : function( instance, item ) {
              var id = item.opts.$orig.attr("data-id");
              var caption = $(this).data('caption') || '';

              if ( item.type === 'image' ) {

                if (item.opts.$orig.prop("class") == 'selected') {
                  caption = (caption.length ? caption + '<br />' : '') + '<button class="btn btn-success remove-color" data-name="'+item.opts.$orig.attr("data-name")+'" data-id="'+item.opts.$orig.attr("data-id")+'"> Remove</button>' ;
                }else {
                  caption = (caption.length ? caption + '<br />' : '') + '<button class="btn btn-success add-color" data-name="'+item.opts.$orig.attr("data-name")+'" data-id="'+item.opts.$orig.attr("data-id")+'"> Add</button>' ;

                }
              }
              return caption;
          }




// later in the code
$(document).on('click', '.add-color', function(e){
...................
.............

   $('.color-thumb-wrapper').find('a[data-id="'+id+'"]').addClass('selected');

.............
.......

});

// this part working correct

但这是火只有一次，当图像是打开和工作正确的，如果我关闭并再次打开图像，一切都正确，我有按钮删除有

问题是当我点击按钮并滑动下一个和上一个图像时，我总是得到按钮添加我尝试用beforeShow，但如何改变标题从beforeshow？

 // This code working correct
 beforeShow: function( instance, current ) {

   if (current.opts.$orig.prop("class") == 'selected') {
       console.log('correct');

      // how to change caption here ?
    }
  },

Answer 1

我用

this.opts.caption =

  beforeShow: function( instance, current ) {

   if (current.opts.$orig.prop("class") == 'selected') {
       this.opts.caption = '<button class="btn btn-success remove-color" data-name="'+this.opts.$orig.attr("data-name")+'" data-id="'+this.opts.$orig.attr("data-id")+'"> Премахни </button>' ;
    }
  },