检查选项卡中当前是否显示加载图标

Question

我的页面上有一个下载按钮，允许用户下载文件。 如果用户按下按钮，则页面开始加载，您可以在选项卡中看到：

我如何获得州？

我试图像这样得到state：

console.log(document.readyState);

但我总是得到complete。 我还试着等一秒钟，因为我认为它会在用户点击按钮之前显示状态：

setTimeout(function(){
  console.log(document.readyState);
  },1000
);

但是，即使在标签中总有一个加载图标停留约15秒，我仍然会得到complete。

如何检查状态？

Answer 1

微调器停止的规则因浏览器而异，但基本描述似乎是“在页面加载时”。但是这可以包括图像，javascript甚至是ajax调用/图像和iFrame等，它们是作为负载的一部分请求的。

由于document.readyState仅与基本HTML相关，因此这通常是启动所有其他加载的触发器，例如$().ready( function() {})构造，它们可以保持微调器的滚动。

你可能有更多运气从$(window).load(...)开出一个事件，这个事件被更加严密地定义为“加载内容时”，它更接近于 旋转器的描述。这将不是一个完美的匹配，因为后续的AJAX调用或iFrame重新加载可能会让spinner再次运行，即使在“load”事件被触发后，但这通常用作需要图像和JS的事件的触发器已经装好了。

或者，如果您知道页面的内容，则可以触发所有图像/ JS / AJAX上的事件，这些图像加载并计算加载（或加载失败）的数字与您期望的数字相匹配。但是，构建钩子的工作要多得多。