1

ページに IFrame があります。親ページには、IFrame を送信するボタンがあります。フォームの送信時に親ページに ProgressBar イメージを表示する送信イベントのハンドラーがあります。この部分はすべて正常に機能しているため、フォームがサーバーに送信され始めると画像が表示されます。

サーバー上で Excel ファイルが生成され、クライアントにダウンロードされます。私がする必要があるのは、イメージがクライアントへのダウンロードをいつ終了したかを知ることです。これにより、その ProgressBar イメージを親ページで非表示に戻すことができます。

IFrame がサーバーからのポストバックを完了し、ファイルがダウンロード可能になったときを知るために、どのイベントを利用できるかわかりません。

IFrame に次のコードがあります

$(document).ready(function () {
                window.parent.$('#ExportWait').addClass('hidden');

                var iframe = window.frameElement;

                if (iframe) {
                    iframe.contentDocument = document;//normalization: some browsers don't set the contentDocument, only the contentWindow

                    var parent = window.parent;
                    $(parent.document).ready(function () {//wait for parent to make sure it has jQuery ready
                        var parent$ = parent.jQuery;

                        parent$(iframe).trigger("iframeloading");

                        $(function () {
                            parent$(iframe).trigger("iframeready");
                        });

                        $(window).load(function () {//kind of unnecessary, but here for completion
                            parent$(iframe).trigger("iframeloaded");
                        });

                        $(window).unload(function (e) {//not possible to prevent default
                            parent$(iframe).trigger("iframeunloaded");
                        });

                        $(window).on("beforeunload", function () {
                            parent$(iframe).trigger("iframebeforeunload");
                        });
                    });
                }

                $("form").submit(function (e) {
                    //console.log('Here We Are');
                    //alert('Exporting');
                    //window.parent.$('#ExportWait').removeClass('hidden');

                    return true;
                });
            });

そして、親ウィンドウに次のコードがあります

$(document).ready(function () {
    $("iframe").on("iframeloading iframeready iframeloaded iframebeforeunload iframeunloaded", function (e) {
        console.log(e.type);
    });
});

コンソールで次のように表示されます iframeloading iframeready iframeloaded ----これらの 3 つは、ページと IFrame が最初に読み込まれたときのものなので、これらのいずれも気にしません ----次に、エクスポートを実行すると、iframebeforeunload が表示されます

しかし、ファイルのダウンロードがいつ完了したかはわかりません。

4

0 に答える 0