从Iframe关闭jQuery UI对话框

我已经实现了以下代码，用于在jQuery对话框中上传照片（使用iframe）。

这是Iframe

这是父页面上的jQuery代码 ，它负责打开对话框。

 $("#upload-image").click(function (e) { e.preventDefault(); $('#upload-form').dialog({ modal: true, width: 300, title: "Upload Image", autoOpen: true, close: function(event, ui) { $(this).dialog('close') } }); }); 

然后，我在上传成功后注入脚本（在iframe页面上），将结果传递回父页面，但我想同时关闭对话框。

 $(document).ready(function () { $(parent.document).find('#imagePathValue').val('theimagevalue'); $(parent.document).find('#upload-form').dialog('close'); }); 

#imagePathValue成功传递，但我似乎无法关闭对话框。

有任何想法吗？

Answer 1

为了使其工作，您必须从父级调用jQuery，而不是从iframe调用。 为此，请使用以下…

 window.parent.jQuery('#upload-form').dialog('close'); 

应该这样做！

Answer 2

试试这个：

 $(document).ready(function () { $(parent.document).find('#imagePathValue').val('theimagevalue'); window.parent.$('#upload-form').dialog('close'); }); 

Answer 3

除此之外，您还应该这样做：

 window.parent.$('#upload-form').remove(); 

所以在关闭对话框后删除Iframe实例。

所以最终的代码应该是：

 $(document).ready(function () { $(parent.document).find('#imagePathValue').val('theimagevalue'); window.parent.$('#upload-form').dialog('close'); window.parent.$('#upload-form').remove(); }); 

谢谢考沙尔

Answer 4

绝对记住要调用那些类型的函数，它必须引用父文档本身的函数。 当您使用jquery构造函数的第二个参数时，您只是指定方法的目标，而不是在何处执行它。

这就是为什么$('element', window.parent.document).method(); 将无法正常工作，而window.parent.jQuery('element').method(); 将。