jquery - 从 iframe 打开模态窗口到父级

Question

我有一个带有 iframe 的页面，在这个 iframe 内有一些链接应该在父窗口中打开一个模式窗口。问题是我无权将代码放入父窗口。我只能访问这个 iframe。有没有办法用 jquery 来完成这种限制？

谢谢！

Answer 1

您可以使用 JQuery 插件SimpleModal

有一个名为“appendTo”的选项，您可以在其中告诉您将 Modal 放在哪里。这种方法的唯一问题是模态框的覆盖显示为 iframe 的大小，因此您必须在打开它后为其提供所需的宽度和高度。

$('#div-modal').modal({
    appendTo: $(window.parent.document).find('body'),
    overlayCss: {backgroundColor:"#333"}, // Optional overlay style
    overlayClose:true, 
});
// Set overlay's width
$(window.parent.document).find('#simplemodal-overlay').css('width', '100%');

如果您要作为模态打开的 div 在您的父窗口中，则可以替换$('#div-modal')为$(window.parent.document).find('#div-modal')

Answer 2

花 1 天时间从 iframe 文档打开模态窗口，我首先做了一个案例：

parent.$("#you_modal_window_selector").css("visibility", "visible");

！！！关键字 changin 是 PARENT。（小写字母）

其次，我使用脚本更改 iframe 包含文档中的所有按钮：

<script> 
 $(function() {
        $(".open-modal").on("click", function (e) {
            var $this = $(this),
            $href = $this.attr("href");
            e.preventDefault();
            parent.$($href).css("visibility", "visible");
            parent.$(".modal-window-dark").css("visibility", "visible");
        });
    });
</script>