Question

我有一个书签。单击时（在任何页面上）：

它从mypage.com插入一个带src的脚本元素。这个src已下载。
src然后：
- 插入iframe（DOM）
- 插入表单（DOM）。该表单定位iframe。
- 将数据添加到表单并将其提交到mypage.com
mypage.com发回回复：<div id = "msg">Message back</div>
此响应div插入iframe。（在Chrome元素标签中验证）
现在我想提醒返回的消息“消息回复”。它不起作用。

创建iframe时，我设置了onload事件：

var i = document.createElement('iframe');
i.setAttribute('id', 'frame-id');
i.setAttribute('onload', 'iframeFormSubmitted();');

然后我有了这个功能：

function iframeFormSubmitted(){
    // in try-catch, alerting error
    var iframe = document.getElementById("frame-id");
    var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
    var msg = iframeDocument.getElementById("msg").innerHTML;
    alert(msg);

}

这最终会被调用两次（我想第一次，因为我也将表单写入iframe）。错误是：

cannot read property innerHTMl of null
cannot call method getElementById of undefined

编辑：contentDocument未定义。我认为这是一个跨领域的事情：How can an iFrame that has content, have an undefined contentDocument object?

Answer 1

在父文档中创建function（iframe所在的文档），例如，父文档中的函数done，如下所示

function done(message)
{
    // do whatever you want to do with message
    alert(message);
}

从服务器（mypage.com）发送以下代码作为回复iframe

// Call the "done" function from the iframe (the last line on the server)
echo "<script type='text/javascript'>parent.done('This is my message')</script>";

它会起作用，我已经将这个问题应用到我的项目中并且完美地工作。

以下从我的工作专业中提供的HTML个片段

<form action="someAction" method="post" id="imageform" name="imageform" target="img_submit" enctype="multipart/form-data">
    <input style="display:none" type="file" name="imgfile" id="imgfile" />
    <input style="display:none" type="submit" name="subimg" value="Submit" />
</form>

这是隐藏的iframe

 <iframe style="display:none" id="img_submit" name="img_submit"></iframe>`

这是done文档中的parent函数（与iframe相同的文件）

function done(lnk)
{
    // this is being used for afile upload (ajax simulation/fake)
    loading('hide');
    document.imageform.reset();
}

发布到iframe目标：无法从iframe获得响应

1 个答案: