如何让 jQuery 以字节为单位获取图像大小，而不是图像尺寸？答案

【问题标题】：How to have jQuery get image size in bytes, not image dimensions?如何让 jQuery 以字节为单位获取图像大小，而不是图像尺寸？
【发布时间】：2012-02-12 22:20:25
【问题描述】：

我正在使用 jQuery 1.7.1。

在浏览器窗口中加载图像后，我想检索其总字节大小。有对象名称/值吗？

【问题讨论】：

可能重复：stackoverflow.com/questions/1310378/…
Javascript 正在客户端的计算机上运行，如果浏览器支持 HTML5 的文件 API，您实际上可以在用户计算机上获取图像的大小，当然如果用户希望您这样做的话。要查找服务器上图像的大小，您将需要像 PHP 或 Rails 这样的 SERVER 语言，或者您可以使用 AJAX 执行 HEAD 请求以获取文件大小，或者您可以将图像加载到画布中并在那里获取文件大小。

标签： jquery

【解决方案1】：

不，您无法使用 jQuery 或纯 JavaScript 获取图像大小。唯一的方法是使用 ajax 从服务器端获取它。

您可以获取图像 url 将其发送到服务或服务器端页面，并让页面或服务返回图像大小。

【讨论】：

【解决方案2】：

试试这个有javascript代码

$("#file_id")[0].files[0].size

【讨论】：

【解决方案3】：

**这里是通过验证获取图像大小和类型的 jQuery 代码**您可以在 jQuery 文件的函数中使用此代码

if (window.File && window.FileReader && window.FileList && window.Blob)
{
   var pic_size = $('#profile_pic')[0].files[0].size;//get file size 
   var pic_type = $('#profile_pic')[0].files[0].type;

   var extension = pic_type.split('/').pop().toUpperCase();

    if (extension!="PNG" && extension!="JPG" && extension!="GIF" && extension!="JPEG" || pic_size>=2048000)
    {
        alert ("Please Select PNG,JPG,GIF,JPEG Image Only and File Size not Greater than 2MB");
        $( "#profile_pic" ).focus()
        return false;
    }
 }

【讨论】：

【解决方案4】：

我认为这是不可能的。您可能需要一种服务器端语言。

【讨论】：

【解决方案5】：

您可以通过以下方式获取文件大小

$("#selector")[0].files[0].size

您还可以通过以下方式获取文件格式

$("#selector")[0].files[0].type

另外，如果你想验证文件大小不超过 2 MB，你可以试试这个

var mS_totalBytes = this.files[0].size;
var mS_size = Math.floor(mS_totalBytes/1024000); // its on MB

根据您的要求使用 if else 条件，如下所示

var mS_totalBytes = this.files[0].size;
var _size = Math.floor(mS_totalBytes/1024000);   // in MB
//alert(mS_size);
if(mS_size >= 1){
    jQuery(".ExportAndroidAsset").prop('disabled', true);
    alert("MAximum File Size is 1MB");
    jQuery(".pxel_Bar").css("width","1%");
    jQuery(".pxel_Progress").hide();
    jQuery(".tab-pane .output label").show();
    jQuery('input[name=imagefile]').val('');
}
else{
    jQuery(".ExportAndroidAsset").prop('disabled', false);
    jQuery(".pxel_Progress").show();
    jQuery(".tab-pane .output label").hide();
}

【讨论】：