通过FileReader加载的图片获取宽度和高度。

19 浏览
0 Comments

通过FileReader加载的图片获取宽度和高度。

这个问题已经有了答案:

如何从JavaScript中的Base64代码获取图像宽度和高度

如何使用JavaScript获取图片大小（高度和宽度）

我有一张通过FileReader创建的图片：

    var fileReader = new FileReader();
    var deferred = $.Deferred();
    fileReader.onload = function(event) {
        deferred.resolve(event.target.result);
    };
    fileReader.onerror = function() {
        deferred.reject(this);
    };
    fileReader.readAsDataURL(file);
    return deferred.promise();

这返回一个基于base64编码的字符串，我用它来：

var img = $('');

然后将其添加到我的页面中。

我希望获取该图像的原始高度和宽度。

我可以通过以下方式获取其在页面上的尺寸：

this.img = img;
this.imgWidth = this.img.width();
this.imgHeight = this.img.height();

但我希望获取它的原始宽度和高度。

admin 更改状态以发布 2023年5月21日
0

1 答案

0 Comments

我认为你唯一能确定图片的宽度和高度的方法是创建一个图像元素，然后从中获取尺寸:

var img = new Image();
img.src = fileB64;
var width = img.width;
var height = img.height;

我假设（没有检查）将一个data: URL加载到图像的src属性中会同步加载。否则使用img.onload。

像这样在屏幕外创建元素，然后可以将完全相同的元素添加到页面中。

0