Javascript 在IE上加载图像时获取图像宽度失败

我有一个图像大小调整功能，按比例调整图像大小。在每个图像上加载一个调用此函数的图像和调整大小，如果其宽度或高度大于我的最大宽度和最大高度。我可以在FF Chrome Opera Safari中获得img.width和img.height，但IE失败。我该怎么办

让我用一段代码解释一下

<img src="images/img01.png" onload="window.onImageLoad(this, 120, 120)" /> function onImageLoad(img, maxWidth, maxHeight) { var width = img.width; // Problem is in here var height = img.height // Problem is in here } 函数onImageLoad（img、maxWidth、maxHeight）{ var width=img.width；//这里有问题 var height=img.height//问题在这里 } 在我的强项中，img.width不适用于IE系列

有什么建议吗

谢谢。

我想试试这个：

    var screenW = screen.width;
    var screenH = screen.height;
    //alert( screenW );
    function checkFotoWidth( img, maxw )
    {
        if( maxw==undefined)
            maxw = 200;
        var imgW = GetImageWidth(img.src);
        var imgH = GetImageHeight(img.src);
            //alert(GetImageWidth(img.src).toString()); // img.width); // objToString(img));
        if (imgW > maxw || (img.style.cursor == "hand" && imgW == maxw))
        {
            if (imgW > screenW) winW = screenW;
            else winW = imgW;

            if (imgH > screenH) winH = screenH;
            else winH = imgH;

            img.width=maxw;
            img.style.cursor = "pointer";

            img.WinW = winW;
            img.WinH = winH;
            //alert("winW : " + img.WinW);
            img.onclick = function() { openCenteredWindow("Dialogs/ZoomWin.aspx?img=" + this.src, this.WinW, this.WinH, '', 'resizable=1'); }
            img.alt = "Klik voor een uitvergroting :: click to enlarge :: klicken Sie um das Bild zu vergrössern";
            //alert("adding onclick);
        }
    }

    function GetImageWidth(imgSrc) 
    {
        var img = new Image();
        img.src = imgSrc;
        return img.width;
    } 

    function GetImageHeight(imgSrc) 
    {
        var img = new Image();
        img.src = imgSrc;
        return img.height;
    } 

function onImageLoad(img, maxWidth, maxHeight) {
   var width, height;
   if ('currentStyle' in img) {
     width = img.currentStyle.width;
     height = img.currentStyle.height;
   }
   else {
     width = img.width;
     height = img.height;
   }
   // whatever
}

编辑-显然，如果我尝试一下，我会发现它不起作用：-）好吧，那么“宽度”和“高度”就IE而言似乎绝对是

元素的属性。可能问题是“加载”事件在错误的时间为元素触发。要检查是否存在这种情况，我将尝试以下方法：

function onImageLoad(img, maxWidth, maxHeight) {
   var width, height;
   if ('currentStyle' in img) {
     width = img.currentStyle.width;
     height = img.currentStyle.height;
   }
   else {
     width = img.width;
     height = img.height;
   }
   // whatever
}

---

伙计，我已经找了两天了。谢谢

我正在使用jQuery，但这并不重要。这个问题与IE中的javascript有关

我以前的代码：

function onImageLoad(img, maxWidth, maxHeight) {
   var width, height;
   var i = new Image();
   i.onload = function() {
     width = i.width; height = i.height;
     // ... stuff you want to do ...
   };
   i.src = img.href;
}

var parentItem=$（“”）
.hide（）；//将显示设置为“无”
var childImage=$（'
这在FF、Opera和Safari中工作，但没有IE。我在IE中得到“0”

我的变通方法：

var parentItem = $('<div/>')
   .hide();      // sets display to 'none'

var childImage = $('<img/>')
   .attr("src", src)
   .appendTo(parentItem)   // sets parent to image
   .load(function(){
      alert(this.width);  // at this point image is not displayed, because parents display parameter is set to 'none' - IE gives you value '0'
   });

var parentItem=$（“”）
.hide（）；
var childImage=$（'我就是这样解决的（因为它是网站上唯一一个我不想使用库的js）

这是因为IE无法计算
显示的宽度和高度：无
图像。请使用
可见性：隐藏
。
不要使用
宽度
和
高度
。请使用
自然宽度
和
自然高度
。这些选项提供了图像文件中未缩放的像素尺寸，可以正常工作跨浏览器。
尝试

    var imageElement = document.createElement('img');
    imageElement.src = el.href; // taken from a link cuz I want it to work even with no script
    imageElement.style.display      = 'none';

    var imageLoader = new Image();
    imageLoader.src = el.href;
    imageLoader.onload = function() {
        loaderElement.parentElement.removeChild(loaderElement);
        imageElement.style.position     = 'absolute';
        imageElement.style.top          = '50%';
        imageElement.style.left         = '50%';
        // here using the imageLoaders size instead of the imageElement..
        imageElement.style.marginTop    = '-' + (parseInt(imageLoader.height) / 2) + 'px';
        imageElement.style.marginLeft   = '-' + (parseInt(imageLoader.width) / 2) + 'px';
        imageElement.style.display      = 'block';
    }


最好先隐藏图像，然后调整大小后再显示。否则，大型图像会产生闪烁效果。您是否尝试过
img.currentStyle.width
？@Fatih建议：不要像那样在HTML中混合使用JavaScript（
onload
属性）。仅在JS中动态附加事件处理程序。在IE 8中工作正常：我发现了问题。愚蠢的IE无法计算显示：无；图像的宽度和高度。我已设置图像可见性：隐藏；然后一切工作正常，但直到图像加载水平和垂直滚动条显示为止。
显示：无
hintit retu+1rns“自动”。但我需要准确的宽度和高度，我指的是尺寸好吧，这是给你的。让我想一想。那么
偏网宽度
/
偏网高度
？我想即使是宽度/高度返回
自动
@Phrogz偏网宽度/偏网高度返回，这些也会起作用0@Fatih那看起来很糟糕。这些图片真的加载了吗？我个人会添加一个
setTimeout（…，1）
从
load
事件开始，给它一个在要求尺寸之前重新布局页面的机会。IMHO，这是页面上的最佳答案，应该是公认的答案。在IE 8中，您可以通过创建图像实例，将src设置为所需图像，并获取该实例的di来获得自然宽度维度：
函数onImageLoad（img，maxWidth，maxHeight）{var ghost=new Image（）；ghost.src=img.src；var width=ghost.width；var height=ghost.height…}
问题是关于JavaScriptFYI的，工作样本/失败样本链接导致HTTP 404错误。
getDisplay().getImage().setUrl(imgURL);
final Image img = new Image(imgURL);
int w=img.getWidth();
int h=img.getHeight();

 function onImageLoad(img, maxWidth, maxHeight) {
   var width = img.width; // Problem is in here
   var height = img.height // Problem is in here
   if (height==0  && img.complete){
       setTimeOut(function(){onImageLoad(img, maxWidth, maxHeight);},50);
   }

 }