Javascript计算图像大小，在图像加载后

function loader(img) { 
     var imgH = img.height; 
     var imgW = img.width; 
     console.log(imgH, imgW);  
    }; 

img = new Image(); 
img.src ='../images/pic1.jpeg'; 
img.onLoad = loader(img);

所以，它是exertain，我会得到图像的大小，但我在控制台中得到“0 0”。和图像的大小是500X700。这段代码有什么问题？Javascript计算图像大小，在图像加载后

来源

2011-09-01 Olga

这是没有意义的：

img.onLoad = loader(img);

要实际功能传递给事件：

img.onload = loader;

和函数中使用this代替img。

您还需要在之前分配事件更改图像的src属性。

另请注意，图像上的加载事件有许多问题。从加载事件的jQuery manual on load():

注意事项与图像一起使用时

开发尝试使用.load要解决的共同挑战（）快捷方式是执行一个功能时的图像（或图像的集合）已完全加载。有几个已知的警告与此应该注意。它们是：

这并不一致，也不可靠地工作，跨浏览器的

它不正确的WebKit如果图像的src设置为相同的SRC像以前

它不火正确地泡了DOM树

来源

2011-09-01 08:20:02

试试这个：

function loader(){ 
    var imgH = this.height; 
    var imgW = this.width; 
    console.log(imgH, imgW); 
} 
var img = new Image(); 
img.onload = loader; 
img.src ='../images/pic1.jpeg';

来源

2011-09-01 09:06:28 Ingemar

我用这种方式：

img.onload = function(){//here wrote everything from loader};

而这是我发现的唯一的工作解决方案。

来源

2011-09-06 04:11:23 Olga

我发现最好的办法就是让电脑先做缩放。

并在正文中声明onload =“some_function（）”。

<body onload="some_function()">

然后在脚本中获得大小。

some_function(){ 

var image1 = document.getElementsByClassName('main')[0]; 
var computedStyle_image1 = window.getComputedStyle(image1); 
var image_width = computedStyle_image1.getPropertyValue('width'); 

}

我与谷歌浏览发现你需要确保你打电话身体DIV否则图像值arn't设置内的onload =“功能”，它拉动0像素的宽度和高度。

来源

2014-01-04 09:02:53

Javascript计算图像大小，在图像加载后

回答

相关问题