2

I have a button which sets window.location to a php file which generates a feed which is then downloaded. However, as the files vary in size due to what data is put into the feed it can sometimes take a while from the click of the button to the file dialog popping up.

What I would like to be able to do is click the button and display a loading.gif until the dialog / file is complete.

Any ideas would be cool!

Cheers

4

7 回答 7

5

我不太确定你为什么需要检查文件的大小？如果您使用 ajax 动态地执行 get/post，并且您所做的只是在发生这种情况时显示一个加载图标，那么抛出一个异步活动指示器相当简单。例如，使用 jquery：

$("#loading").ajaxStart(function(){
   $(this).show();
});

$("#loading").ajaxStop(function(){
   $(this).hide();
});

$("#feeds").load("feeds.php?id=89734258972347895");

上面的代码设置了一个 id 为“正在加载”的 DOM 对象，以在任何异步请求已启动和停止时显示和隐藏。.load(url) 将 url 的内容加载到 div #feeds 中。如果您使用 php 设置 content-disposition: 附件头，它会自动启动文件下载窗口，即使它已异步加载到 div 中。当然，这在没有 jquery 的情况下也是可能的，只有一堆浏览器兼容性 javascript，而且它不像简单地订阅 ajaxStart 和 ajaxStop 事件来显示和隐藏加载 img 那样简单。

乔什

于 2009-09-15T14:59:41.017 回答
1

这是老派，但这可以通过服务器推送轻松完成

<?php
  $separator = "end_of_section_marker";
  header('Content-type: multipart/x-mixed-replace;boundary=$separator');
  print "\n--$separator\n";
  print "Content-type: text/html\n\n";
  // Send placeholder message here
  print "--$separator\n";
  ob_flush();
  flush();
  // Start long processing here
  print "Content-type: text/html\n\n";
  // send data here
  print "--$separator--\n";
?>

只需调整您要发送的数据的内容类型。$separator 可以是任何值，只要它不出现在发送的数据中即可。

于 2009-09-15T18:09:07.263 回答
1

我过去使用的一种方法是这样的......

  • 将 window.location 设置为加载页面，并在查询字符串中传递目标页面。加载页面应该显示一个动画 gif 或任何你喜欢的东西来证明正在处理。加载页面应立即重定向到在查询字符串中传递的目标页面（以及任何其他适用的查询字符串参数）。

编辑：加载页面应该使用 javascript 重定向到目标页面（将 window.location 设置为查询字符串中提供的 URL）。这一点很重要，因为如果您在服务器端重定向，则不会显示加载页面。

编辑 2：如果您的加载页面是 php 文件，您可以检查要下载的文件的大小并向用户显示估计的下载时间（以及动画“加载”gif），或者诸如此类。

  • 目标页面应在启用缓冲的情况下呈现（在呈现任何内容之前调用 ob_start()）。启用缓冲后，在呈现整个页面之前不会向浏览器发送任何内容。同时，您从第 1 步开始的加载页面将继续显示。
于 2009-09-17T14:20:27.063 回答
1

在设置 window.location 之前，您可以使用 gif 显示隐藏的 div

于 2009-09-09T14:32:49.307 回答
0

您将不得不使用 AJAX 与服务器通信以发现您正在下载的文件的确切大小。然后你有一些东西要测试。无法仅从客户端知道预期有效负载的大小。

于 2009-09-12T12:00:34.530 回答
0

只需让 RSS 生成脚本显示您想要的图像（输出图像的 HTML，然后刷新输出缓冲区并开始数据生成）。在数据生成结束时：

<?php
print '<script>window.location = "http://www.newlocation.com"</script>'

就这样。

于 2009-09-18T07:37:13.163 回答
0

您是否可以使用 iframe 加载提要，然后使用间隔检查 iframe/文档的 readyState？所以这个过程是：

  • 加载一个包含宽度和高度为 100% 的 iframe 和 iframe 上的 loading.gif 的窗口。
  • 设置检查 iframe.contentWindow.document.readyState 属性的计时器
  • 一旦 readyState == 完成，显示保存文件对话框。

一个缺点是，对于大多数浏览器，PHP 文件需要位于同一个域中（在 IE 上，您只需检查 iframe 的 readyState 属性）。

于 2009-09-15T08:57:51.710 回答