使 open fancybox 模态化

Question

我有一个 Fancybox，里面有两个按钮：合并和取消。取消关闭 fancybox，合并发布表单并等待页面重新加载。页面重新加载需要几秒钟，因此在用户按下“合并”后，我禁用“取消”按钮，我想将选项

modal

设置为

true

，但我似乎找不到设置的方法已打开的 fancybox 上的选项。有人对如何做到这一点有任何建议吗？

游乐场：http://jsfiddle.net/vCtVq/

Answer 1

没有简单的选项可以切换“模态”状态，fancyBox 要么是模态，要么不是。但我可以想到两种解决方案。

1）隐藏关闭按钮并取消绑定叠加层上的点击事件 -

$('#merge').click(function() {
    $('#cancel').attr("disabled", "disabled");

    $('.fancybox-item').hide();
    $('.fancybox-overlay').unbind();

    console.log('submit');
});

演示 - http://jsfiddle.net/am8d3/

2）创建一个全局变量，并使用“beforeClose”回调检查它。您可以通过返回“false”来取消关闭 -

var busy = false;

$(".o").fancybox({
    //modal: true
    beforeClose: function() {
        if (busy) {
            return false;
        }
    }
});

演示 - http://jsfiddle.net/MLjAT/

Answer 2

Fancybox 在函数运行时会初始化一次，并且我很确定不能使用不同的选项重新初始化。您可以做的是创建一个标志并使用一些更传统的 JavaScript 来控制关闭行为。从一开始就将 modal 设置为 true，并使用主体单击事件来处理关闭。然后，设置一个真/假标志来确定是否单击了合并，从而允许或不允许窗口在单击正文时关闭。像这样的东西：

$('body').click(function(e) {    
    if (allowClose == true) {
        $.fancybox.close();
    }
})​

我已更新您正在摆弄此解决方案此处。

Answer 3

在 v4 中，您触发打开它的方式如下：

Fancybox.show([{ src: "#modalForm" }]);

在旧版本中

$.fancybox.open({src: '#modalForm', type: 'inline'});