Javascript从路径获取img的宽度

时间:2013-06-28 11:32:16

标签: javascript

我认为应该有一个简单的解决方案,但我无法弄明白。 我想要做的是通过路径获取图像的宽度/高度(不在屏幕上呈现)。

像:

var img = ImageInfo(path);
alert(img.width);

(我想在普通的javascript中这样做)

3 个答案:

答案 0 :(得分:4)

您可以这样做:

function getImageSize(imgSrc) {
     var imgLoader = new Image(); // create a new image object

    imgLoader.onload = function() { // assign onload handler
        var height = imgLoader.height;
        var width = imgLoader.width;
        alert ('Image size: '+width+'x'+height);
    }

    imgLoader.src = imgSrc; // set the image source
}

您基本上使用javascript创建新图像。分配onload事件,然后设置源并等待图像加载。当它被加载时,onload处理程序会警告图像的高度和宽度。检查此jsFiddle

答案 1 :(得分:1)

ImageInfo函数接受回调(即:使其异步)。

function ImageInfo(path, onLoad) {
  var img = new Image();
  img.src = path;
  img.onload = function() {
    onLoad(img);
  }
}

使用它像:

ImageInfo(url, function(img) {
  alert(img.width);
});

答案 2 :(得分:0)

试试这个:

var path = "http://images2.wikia.nocookie.net/__cb20110928222437/callofduty/images/4/4f/Personal_IW_FTW_Awesome_Face_100px.png";

var img = new Image();

img.src = path;

它非常简化,但这些行应该有效。

http://jsfiddle.net/s9QVp/1/