javascript - 当子窗口打开并完成加载时收到通知

Question

如何检查子窗口何时打开并且其内容全部从服务器接收并完全加载？

我正在做的是显示一个ajax通知程序.gif，因为这个window.open大约需要15秒，我需要给用户一些东西看。

这是我尝试过的一种方法，但是一旦窗口打开，ajax 加载器通知程序就会关闭，这是可以预料的，但我已经将其作为示例了。

AlumCloud.showAjaxLoader();

 if (window.open(['/api/rollup?f=', getResponseFormatOpt(), '&ids=', options.ids.join(','), '&lbls=', options.addLbls].join(''), '_blank',
                 'width=' + WIN_OPEN_WIDTH + ',height=' + WIN_OPEN_HEIGHT, false)) {

  AlumCloud.removeAjaxLoader();
    };

当窗口打开并完全加载其内容时，如果有回调就好了。

但是，如果有另一个时间间隔来继续检查窗口是否已加载，我可以设置一个时间间隔。

<小时/>

这是让我非常接近但不起作用的东西。

    var url = ['/api/rollup?f=', getResponseFormatOpt(), '&ids=', options.ids.join(','), '&lbls=', options.addLbls].join('');
    $.ajax({
        url: url,
        cache: true,
        complete: function (jqXHR, textStatus) {

           var w = window.open("", '_blank', 'width=' + WIN_OPEN_WIDTH + ',height=' + WIN_OPEN_HEIGHT, false);

            w.document.body.appendChild($('<iframe src="' + url + '" width="100%" height="100%" >').get(0));
        }
    });

如果我将该 iframe 附加到当前窗口，它会起作用，但如果我尝试将 iframe 附加到我正在打开的新窗口，则不起作用。

Answer 1

这就是你可以做到的。

JS

$.ajax({

    url: "YourajaxcallURL",
    data: "DataIfany",
    beforeSend: function () {
        // this is where we append a loading image
        $('#ajax-panel').html('<div class="loading"><img src="loading.gif" alt="Loading..." /></div>');
    },
    success: function (data) {
        $('#ajax-panel').empty();

    },
    error: function (data) {
        $('#ajax-panel').empty();
    }
});

并将其添加到您的HTML中:

 <div id="ajax-panel"> </div>

CSS:

#ajax-panel {
  position: absolute;
}