如何实现 Fancybox 3 的确认对话框？

Question

我是 Fancybox 的忠实粉丝，而且我已经使用它多年了。目前我正在考虑安装最新版本，我想使用 Fancybox 3 (https://fancyapps.com/fancybox/3/) 项目页面上演示的确认对话框。但我不明白如何做到这一点。我在哪里可以找到相关设置、如何启动对话框以及对话框中的内容来自哪里？

Answer 1

基本上，您像往常一样显示一些内联内容，然后使用afterClose 回调来检查单击了哪个元素以关闭模式（提示：将data-fancybox-close 属性添加到任何元素以充当关闭按钮），就像这样：

afterClose : function( instance, current, e ) {
    var button = e ? e.target || e.currentTarget : null;
    var value  = button ? $(button).data('value') : 0;

    // Here you can choose what to do depending on the element
  }

这是一个更完整的代码 - https://codepen.io/fancyapps/pen/YRPoVB?editors=1010 - 用于主页。