使用 jQuery 查找下载链接后面的文件大小答案

【问题标题】：Find size of file behind download link with jQuery使用 jQuery 查找下载链接后面的文件大小
【发布时间】：2010-11-29 06:28:15
【问题描述】：

我想知道是否有一种方法可以使用 jQuery 来找出我链接到网页的 PDF 的文件大小。

我希望将鼠标悬停在下载链接上时，会弹出一个模式框，显示 PDF 的文件大小。我可以做第二点，我唯一想知道的是如何找出文件大小。我不知道 jQuery 是否能够做到这一点。如果不是那么太糟糕了我猜..

提前干杯。

【问题讨论】：

Get size of file requested via ajax的可能重复

标签： jquery html filesize

【解决方案1】：

我觉得在客户端做这个太多了，但我不知道你的应用程序的细节，所以假设你必须用 jQuery 来做......你可以做一个 HEAD 请求并查看内容长度标头。之前我推荐过jqHead插件，但是我尝试使用后发现它坏了。

这是一个不依赖任何额外插件的工作示例：http://host.masto.com/~chris/so/jqhead.html

它的实质很简单：

  var request;
  request = $.ajax({
    type: "HEAD",
    url: $("#url").val(),
    success: function () {
      alert("Size is " + request.getResponseHeader("Content-Length"));
    }
  });

【讨论】：

我基本上是在写一个建议 HEAD 请求的答案，但你也打败了我。可能有助于显示使用/不使用插件的代码。
太棒了，但开发者应该注意到域隐私发生在这里:)
按照@InviS 的说法，尝试使用另一个域上的http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
@vol7ron 无论您的 .js 文件是从哪个域加载的。它适用于您的域。如果您的站点具有域 a.com 并且您将使用 AJAX 从 b.com 获取数据，则应将 xhrFields: { withCredentials: true } 字段添加到 ajax 选项，查看 jQuery.ajax 了解详细信息，服务器应以正确的 @987654326 响应@字段
我刚刚发现并非所有服务器都发送 Content-Length 标头 :(

【解决方案2】：

如果您要将文件上传到服务器，这里正在运行 sn-p 以在 javascript 中查找文件大小而无需访问服务器。

这个想法有助于在将大文件上传到服务器之前限制文件大小。

<input type="file" id="loadfile" />
<input type="button" value="find size" onclick="findSize()" />
<script type="text/javascript">
    function findSize() {
        var fileInput = $("#loadfile")[0];
        alert(fileInput.files[0].size); // Size returned in bytes.
    }    
</script>

【讨论】：

@Kyle Sevenoaks：对不起那个凯尔。正在摆弄它，我回滚到你的:)
在 Firefox 和 Safari 中运行良好。我猜没有 jQuery 如此惨淡的失败。
在 Firefox 中，fileSize 已被弃用，取而代之的是 size。
如果我想查看文件日期怎么办？用什么？谢谢你^^

【解决方案3】：

如果你事先知道文件大小，你可以把它放在下载链接的标题属性中。您还可以使用 jQuery 显示自定义弹出窗口。

否则，如果不实际下载整个内容 AFAIK，就无法仅获取 URL 的文件大小（内容长度）。

【讨论】：

【解决方案4】：

我能想到的唯一方法是创建一个可以返回 PDF 文件大小的 Web 服务。

【讨论】：

【解决方案5】：

在上面的答案中，Chrome 21 和 Safari 6 没有 fileSize 成员，但确实有 size。使用：

fileInput.files[0].size

【讨论】：