如何从父点击事件触发 iframe 发布答案

【问题标题】：How to trigger iframe post from parent click event如何从父点击事件触发 iframe 发布
【发布时间】：2013-10-30 12:30:46
【问题描述】：

我正在使用 Jquery 多文件上传控件来上传多个文件。很不错的插件，一切正常。

我想在 iframe 中加载那个插件，我应该从父窗口触发全局启动回发方法

以下是我的示例代码

LibraryDocs.aspx（父界面）

> <iframe style="width: 90%; height: 300px" id="multipleFileUploadFrame"
> src="../Secure/MultipleFileUpload.htm" runat="server" />

> <asp:Button ID="postCompleteButton" runat="server" Text="Post Complete" />

这是我的 MultipleFileUpload.htm

<div id="fileupload">
        <form id="multipleUpload" action="../Secure/MultipleUploadHandler.ashx" method="POST"
        enctype="multipart/form-data">
        <div class="fileupload-buttonbar">
            <label class="fileinput-button">
                <span>Add files...</span>
                <input id="file" type="file" name="files[]" multiple />
            </label>
            <button id="startUpload" type="submit" class="start">
                Start upload</button>
            <button type="reset" class="cancel">
                Cancel upload</button>
            <!--<button type="button" class="delete">Delete files</button>-->

        </div>
        </form>
        <div class="fileupload-content">
            <table class="files">
            </table>
            <div class="fileupload-progressbar">
            </div>
        </div>
    </div>

所以我的问题是在父窗口中单击 postCompleteButton 按钮后，它应该在 iframe 中的子窗口中触发 post 事件（开始按钮）

【问题讨论】：

标签： javascript jquery asp.net iframe jquery-file-upload

【解决方案1】：

如果两个页面同源，可以参考this，否则使用easyXDM（http://easyxdm.net/wp/）之类的库。它将允许您在 iframe 和容器窗口之间交换消息或设置远程过程调用。从文档中检查此页面 - remote procedure calls

【讨论】：

Thax dobrinov 为您的回复，我尝试这样做，因为它是同源我使用第一种方法，但不幸的是它对我不起作用。没有任何 Jquery 解决方案而不是使用 javascript。

【解决方案2】：

如果您使用的是 jQuery，则可以使用

访问 iframe DOM

$('#<%= multipleFileUploadFrame.ClientID %>').contents()

考虑到这一点，要单击 iframe 中的开始上传按钮，请使用

$('#<%= multipleFileUploadFrame.ClientID %>').contents().find('#startUpload').click();

请记住，这仅在父源和 iframe 源位于同一域中时才有效，因为浏览器将遵守 same origin policy

【讨论】：