iframe fancybox 关闭后刷新父窗口

Posted 2023-05-09

【中文标题】iframe fancybox 关闭后刷新父窗口

【英文标题】：Refresh parent window after iframe fancybox closes

【发布时间】：2016-06-30 18:46:03

【问题描述】：

我有一个网站，当我点击一个链接时，它会弹出一个花式框窗口，供用户在表单中输入一些详细信息。

一旦用户完成表单并关闭它，我希望父窗口刷新以便显示新数据。

我正在使用fancybox 2.1.5 版，如果我可以对jquery.fancybox.js 进行更改以实现此更改而不是在单个盒子上，因为这是需要在所有精美盒子上工作的东西。

有什么建议吗？

这就是我现在运行fancybox的方式：

<script type="text/javascript">
    $(document).ready(function() 
        $('.fancybox').fancybox();

        $("#fancybox-manual-b").click(function() 
            $.fancybox.open(
                href : 'device-info.php',
                type : 'iframe',
                padding : 5
            );
        );
    );

</script>

这是从 href 中引用的，如下所示：

<a class="fancybox fancybox.iframe" href="edit-device.php"><img src="img/edit.png"</a>

【问题讨论】：

更好的方法似乎是使用afterClose 回调，解释here。你能提供调用fancybox的代码吗？ 强烈建议不要更改 jquery.fancybox.js 代码，因此适应 fancybox 调用可能会更好。

我已按要求对其进行了编辑以获取代码。感谢您的帮助。

【参考方案1】：

您可以使用通用配置对象，只需修改每次调用所需的属性。像这样的：

// This is the basic config, common to all calls
var fancybox_general_config = 
    type : 'iframe',
    padding : 5,
    afterClose: function() 
        location.reload();
    


// modifies just the href attribute, keeping other values
fancybox_general_config.href = 'device-info.php';
$("#fancybox-manual-b").fancybox(fancybox_general_config);

// modifies just the href attribute again, keeping other values
fancybox_general_config.href = 'device-info-2.php';
$("#fancybox-manual-c").fancybox(fancybox_general_config);

希望对你有帮助！