jquery - 提交登录表单后关闭 Fancybox 模式窗口并重新加载页面

Question

我在 FancyBox 2 模式 iframe 窗口中打开了一个登录表单。但是，当您提交表单时，网页将在模式中打开。

谁能告诉我是否以及如何使 Fancybox 模式关闭，并在提交登录表单时重新加载底层页面？

这是我当前的代码 - 在functions.js 文件中:

  $(".login-popup").fancybox({
    maxWidth    : 310,
    height      : 300,
    autoSize    : false,
    closeClick  : false,
    openEffect  : 'none',
    closeEffect : 'none'
  });

这是我的登录链接:

<a class="login-popup" data-fancybox-type="iframe" href="/popup/login" title="">Login</a>

感谢您的帮助，

斯特

编辑1:

感谢您对此的帮助。抱歉，我是个新手，但我在获取父级时遇到了麻烦。$.fancybox.close();处理表单的submit() 事件。这是我现在使用的代码，但它不会关闭窗口，因为我做错了什么。有什么想法吗？谢谢。

$(".login-popup").fancybox({
    closeEffect : 'none',
    'afterClose':function () {
      window.location.reload();
    },
  });

$(".login-form").submit(function(){
  parent.fancyBoxClose();
});

Answer 1

要从 iframe 内关闭 fancybox，您可以在 form 上使用 parent.$.fancybox.close(); submit() 事件。

然后在 Fancybox 初始值设定项上添加 onClose 事件，这将重新加载页面:

$(".login-popup").fancybox({
    maxWidth    : 310,
    height      : 300,
    autoSize    : false,
    closeClick  : false,
    openEffect  : 'none',
    closeEffect : 'none',
    'afterClose':function () {
        window.location.reload();
    },
  });