日期:2014-05-17  浏览次数:20487 次

js獲取圖片大小
<img src="Images/1111.gif" alt="" /> 有一個圖片 js怎麼獲取他的大小  不是長寬

------解决方案--------------------


<script language="javascript">

    var img = document.getElementByid("img");//通过ID获取IMG元素

    var image = new Image();//new一个image对象

    image.src=img.src;

    //获取尺寸

    image.width;//宽

    image.height;//高

    //获取大小

    image.onreadystatechange = function ()
{
       if (image.readyState == "complete")
       {
         initFileSize=image.fileSize;
        var fileSize=Math.ceil(initFileSize/1024);
         imgSize.innerHTML="尺寸:"+img.height+"×"+img.width+" "+fileSize+"k";
        }
    }

</script>

注意点:图片加载完成后才能成功获取图片大小,所以要判断在readyState=="complete"的状态下获取大小

------解决方案--------------------
  <input type="button" value="GET Size" onclick="getFileSize(document.getElementById('xx'))" />
  <img src="a.jpg" id="xx" alt="" />
  <script>
    function getFileSize(o) {
      x = window.XMLHttpRequest ? new window.XMLHttpRequest : new ActiveXObject("MSxml2.XMLHTTP");
      x.open("HEAD", o.src, false);
      x.send();
      alert("大小:" + x.getResponseHeader("Content-Length"));
    }
  </script>

------解决方案--------------------
以上代码兼容所有浏览器
------解决方案--------------------


  <img src="a.jpg" id="img1" alt="" />
  <script>
    function getFileSize() {
      var 0=document.getElementById(img1);
      x = window.XMLHttpRequest ? new window.XMLHttpRequest : new ActiveXObject("MSxml2.XMLHTTP");
      x.open("HEAD", o.src, false);
      x.send();
      alert("大小:" + x.getResponseHeader("Content-Length"));
    }
  </script>

------解决方案--------------------
引用:
以上代码兼容所有浏览器