操作后关闭 FancyBox？答案

【问题标题】：Close FancyBox after action?操作后关闭 FancyBox？
【发布时间】：2012-07-06 09:08:36
【问题描述】：

我的页面上有一些链接，点击后会打开一个花式框。在幻想框内有一些操作按钮（如“关闭项目”、“删除项目”）。单击这些按钮时，我希望它像往常一样提交表单，然后关闭fancybox。我怎样才能在不干扰 POST 的情况下安装它来做到这一点？

注意：我没有使用 Ajax。

【问题讨论】：

【解决方案1】：

如果你的后端返回一些东西，例如我的回声“发送”完成，你可以这样做：

$.post("php/send_mail.php", function(result){
    if(result == 'sent'){
    //$('#success').slideDown('slow'); -My code
    //$('#submit').hide(); -My code
    $.fancybox.close();
    }
});

只有在你的情况下你才想做 $.fancybox.close()

如果您通过 $.ajax 而不是 .post 执行此操作，则可以使用 success: 代替。

对不起，如果这没有帮助。

【讨论】：

【解决方案2】：

标记，

当您说执行帖子时，我假设您的意思是您希望在发送请求后立即关闭花式框（或尽可能接近那个时间）？我假设您正在序列化 fancyBox 的片段作为 POST 的一部分，并且不想过早关闭它。

在这种情况下，我会利用 jQuery.ajax beforeSend 回调在发出请求之前关闭该框：

$.ajax({
  beforeSend: function() {
    //close fancybox here
  }
});

此时会创建 XMLHttpRequest，因此不会对请求产生任何影响。

--安德鲁

【讨论】：

不...我不需要序列化任何东西。而且它没有使用 jQuery.ajax。这是一个普通的旧形式。我想当你点击按钮时，它需要去执行<form action='xxx'>，这是一个重定向，对吗？然后我不知道把钩子放在哪里。但我想我可以 ajaxify 按钮和完全关闭的幻想框？

【解决方案3】：

如何隐藏表单，将表单元素移动到body元素下方，然后调用form.submit()。

【讨论】：

【解决方案4】：

我不确定是否理解您的问题，但我注意到当fancybox 打开带有许多链接、在fancybox 的title 属性中动态创建的按钮时，这些元素不在您页面的DOM 中。而且您无法与页面元素进行交互。

我不知道您如何创建操作按钮（例如“关闭项目”、“删除项目”），也许您应该解释一下，以帮助我们帮助您:)

【讨论】：

【解决方案5】：

我遇到了和你一样的问题。我有一个很好的解决方案，如下所示。如果我像往常一样使用 php post 作为 codeigniter

'<?php
if ($this->input->post())
  {
*after finishing the action use the below code

echo  "<script>  parent.jQuery.fancybox.close(); </script>";

}'
?>
//if you want to refresh the parent window use  parent.location.reload(); before close the //fancy box

【讨论】：