如何在调用fancybox.open()时传入jQuery对象及opts配置？

$.fancybox.open() 原生支持多参数传入，你只需要把配置项作为第二个参数传入即可，不需要额外封装改造：

// 已有的弹窗jQuery对象
const popup = $('#popup');

// 自定义配置项
const fancyOpts = {
  afterClose: function () {
    // 此处编写弹窗关闭后需要执行的业务逻辑
  },
  // 其余配置（如宽高、遮罩透明度、动画效果等）都可以在此处声明
};

// 调用时依次传入内容源、配置项即可
$.fancybox.open(popup, fancyOpts);

版本兼容说明 #

• 上述写法在 Fancybox 3.x、4.x 主流版本中均可正常生效，第一个参数支持传入jQuery对象、原生DOM对象、HTML字符串、图片地址等各类合法内容源
• 如果你使用的是较早的Fancybox版本，回调不触发时可以尝试把回调函数放到on节点下配置：

const fancyOpts = {
  on: {
    afterClose: function () {
      // 关闭后回调逻辑
    }
  }
}

• 多内容轮播场景下，还可以传入第三个参数指定默认打开的内容索引，例如$.fancybox.open(popupList, fancyOpts, 0)表示默认打开组内第一个内容。

内容的提问来源于stack exchange，提问作者Andrew Stepanenko