jQuery圖像寬度（）在IE9中沒有返回正確的值

我們有一個圖像標籤，指定寬度和高度爲auto，以便我們可以獲取實際圖像的寬度和高度。所以我們使用以下來獲得它們。jQuery圖像寬度（）在IE9中沒有返回正確的值

$("img.list-image").width() 
$("img.list-image").height()

在FF，鉻，IE8和Safari

，寬度和高度返回分別125像素和160像素，並且這些值是正確的。但在IE9中，寬度爲1519像素，高度爲771像素。由於某些原因，這些寬度和高度函數在IE9中沒有返回適當的值。任何幫助表示讚賞。

編輯： 以下是代碼，我們正在使用這個關鍵詞總是很棘手，有時令人困惑的使用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Image Page</title> 
    <style type="text/css" > 
    .list-category-image 
    { 
     border-width: 0px;display:none; 
    } 
    </style> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
     //<![CDATA[ 

     $(function() { 
      categoryImageaspectratio(); 
     }); 

     function categoryImageaspectratio() { 
      $("img.list-category-image").one('load', function() { 
       var width = 85.0, height = 85.0; 
       var realWidth, realHeight; 
       realWidth = $(this).width(); // Note: $(this).width() will not 
       realHeight = $(this).height(); 

       //alert("width, height = (" + realWidth + "," + realHeight + ")"); 

       // Now scale the image. 
       var aspectRatio = 1.0; 
       if (realHeight/height > realWidth/width) { 
        aspectRatio = realHeight/height; 
        width = realWidth/aspectRatio; 
       } 
       else { 
        aspectRatio = realWidth/width; 
        height = realHeight/aspectRatio; 
        //alert("aspectRatio = " + aspectRatio); 
        //alert("height = " + height); 
       } 

       var imgWidth = parseInt(width) + "px"; 
       var imgHeight = parseInt(height) + "px"; 

       //alert(imgWidth + ", " + imgHeight); 

       // $(this).css("width", imgWidth).css("heigth", imgHeight).css('display', 'block'); 
       $(this).css("width", imgWidth).css("heigth", imgHeight).css('display', 'block').css('text-align', 'center').css('margin-left', 'auto').css('margin-right', 'auto'); 
      }).each(function() { 
       if (this.complete) { 
         $(this).load(); 
       } 
      }); 
     } 
    </script> 
</head> 
<body> 

    <div style="width:85px; height:85px;"> 
     <img class="list-category-image" src="http://ecx.images-amazon.com/images/I/411j0fCdVKL._SL160_.jpg" alt="" /> 
    </div> 

</body> 
</html>

來源

2011-06-30 mohang

你能爲我們提供（非）工作演示？ – jensgram

給你的CSS和HTML – bravedick

你使用的是最新的穩定版本的jQuery？舊版本可能不支持IE9。 – Luc125

，它可以在JavaScript的不同實現不同的值。嘗試定義映像，作爲一個變量看它是否修復您的問題：

 var imgList = $("img.list-category-image"); 
     imgList.one('load', function() { 

      var width = 85.0, height = 85.0; 
      var realWidth, realHeight; 
      realWidth = imgList.width(); // Note: $(this).width() will not 
      realHeight = imgList.height();

您可以使用下面的代碼檢查什麼的這種類型是：

alert(typeof(this));

來源

2011-07-11 20:30:13

但是我們有幾張圖片需要我們使用，因此可能需要一個循環才能使其工作。然而，我們通過添加解決問題的jQuery 1.5.1版本來解決這種情況。感謝您的嘗試。併爲你的努力+1。 – mohang

jQuery圖像寬度（）在IE9中沒有返回正確的值

回答

相關問題