是否可以检测iframe的内容何时将要更改，例如请求何时开始（用户单击iframe中的链接的结果）而服务器尚未发送响应？
背景：
我有一个旧版Web应用程序，该应用程序在不显示加载状态的容器中使用。此网络应用程序还使用iframe来模拟部分页面加载。所有导航都在该iframe中进行。
当加载iframe中的页面时，我通过监视iframe的onreadstatechange事件（仅适用于IE）在iframe的父页面上显示加载动画：
$('#iframe').on('readystatechange', function () {
var state = this.readyState;
(state === 'loading' || state === 'interactive') && $('#loading').show();
state === 'complete' && $('#loading').hide();
});
但是，该实现具有明显的局限性。当发出请求的时间与Web服务器响应的时间之间存在间隙时，就会出现问题。
例如，如果用户在iframe中单击触发某种长时间运行过程的链接，则由于Web服务器尚未发送其响应，因此状态指示符动画不会显示。状态指示器动画仅在服务器发送响应并且新页面开始加载之后显示（where readyState === 'loading'）。
因此，最终结果是有时用户不知道正在发生任何事情。在典型的Web浏览器中，当您单击链接时，即使服务器花时间响应，也会播放加载动画。因为我的Web应用程序包含在WinForms WebBrowser控件中（并且我没有WinForms应用程序的控件），所以没有任何迹象表明最终用户正在发生任何事情。
由于iframe页面和父页面的来源相同，因此它们可以相互通信。您要做的就是将处理程序附加到iframe contentWindowonbeforeunload事件。
您将在onbeforeunloadcontentWindow事件中显示“正在加载...” -因为它发生在页面开始导航之前，而在iframe中onload则隐藏“正在加载...”，因为它发生在之后。
这是演示：http : //jsfiddle.net/xga7Q/1/单击需要花费一些时间才能加载的链接（例如，展开“示例”并选择任何示例。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句