Question

我正在使用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事件（开始按钮）

Answer 1

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

中查看此页面

Answer 2

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

访问iframe DOM

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

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

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

请注意，这只有在父网址和iframe源位于同一个域且浏览器将遵守same origin policy

的情况下才有效

如何从父点击事件中触发iframe帖子

2 个答案: