【问题标题】:Close jquery dialog from iFrame with external html使用外部 html 从 iFrame 关闭 jquery 对话框
【发布时间】:2014-07-11 06:12:06
【问题描述】:

我正在尝试从内部带有外部 html 的 iframe 关闭 jQuery ui 对话框。

我的代码如下所示:

我的主 html 中的 JS 代码用于在我单击按钮时创建对话框:

function createDialog() {
        return $("<div id='personal-popup' class='dialog' title='Copia de archivos'></div>")
        .html('<iframe style="border: 0px; " src="copy.html" width="100%" height="100%"></iframe>')
        .dialog({
            resizable: true,
            height: 447.59999990463257,
            width: 993.5999999046326,
            modal: true
        });
    }

其他html里面的JS代码(copy.html)

function copiarArchivos() {


$.mobile.loading('show',{
  text: "Copiando",
  textVisible: true,
  theme: "a",
  html: ""
});

var result = [];

var allOptions = $("#select-custom-19");

$("#select-custom-19 option:selected").each(function () {

var $this = $(this);
var selText = $this.text();
$this.prop("selected", false);
result.push(selText);
});

allOptions.selectmenu('refresh', true);

$.ajax ({
  url: "php/copia.php",
  type: "post",
  data: {"params": result},
  success: function(response) {
        $.mobile.loading('hide');
        //I want to close the dialog here when the ajax function success
        $(window.parent.document).find("#personal-popup").dialog('close');
    }

}); 
}

我已经按照这个问题的答案:Close jQuery UI Dialog from Iframe,但它对我不起作用。

--- 编辑 ---

将从iFrame中调用的JS函数,分配在mane html (index.html)中

function closeDialog(){
    console.log("Im working!!");
    document.getElementById("personal-popup").dialog("close");
    }

来自 iframe (copy.html) 的 JS 调用

$.ajax ({
  url: "php/copia.php",
  type: "post",
  data: {"params": result},
  success: function(response) {
        $.mobile.loading('hide');
        window.parent.closeDialog();
    }

}); 

【问题讨论】:

    标签: javascript jquery html jquery-ui iframe


    【解决方案1】:

    您可以从 iframe 内部访问window.parent

    这意味着在您的主框架中,您可以:

    window.closeDialog = function(){//Do stuff}

    Anf 然后在你的 iframe 中有:

    window.parent.closeDialog();

    【讨论】:

    • 我已按照您所说的进行操作,但仍然没有为我工作。我添加了以下 js 函数: function closeDialog(){ document.getElementById("personal-popup").dialog("close"); }
    • 尝试将console.log("Im working!!")添加到函数中,看看它是否被正确调用:)
    • 我在控制台中看不到任何东西,但是 ajax 调用它已经完成,因为我可以看到复制到我的目录中的文件...有点奇怪...
    • 这意味着该函数没有被调用。尝试将函数放在 $(document).ready(function(){//function here}) 内的 iframe 中
    • ajax 调用它被调用,我可以看到 $.mobile.loading 是如何隐藏的,没有被调用的是作为主要 html 的 js 函数。无论如何,如果我将函数放在我的第二个 html (copy.html) 中,我将无法访问对话框 div,是吗?
    猜你喜欢
    • 2016-05-12
    • 2011-05-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-04-04
    • 2012-02-16
    • 1970-01-01
    • 2012-12-29
    相关资源
    最近更新 更多