Question

我如何上传图片的高度和宽度，以原始尺寸显示。

Answer 1

记住Brad说的话（这似乎是服务器端功能），你可以使用这个php代码，但你应该首先验证上传的文件是否真的是一个图像。

list($w, $h) = getimagesize($_FILES['yourUploadedFieldName']);

// $w holds the numeric width
// $h holds the numeric height

Answer 2

在客户端大小的情况下，您可以使用以下内容：

;(function($){
    $.imageSize = function(imgUrl,callback){
        var img = $('<img>').attr('src',imgUrl).css('display','none').appendTo('body');
        img.load(function(){
            var call = callback || function(i,w,h){};
            call(imgUrl,$(this).width(),$(this).height());
        });
    };
})(jQuery);

（jQuery插件）在加载之前无法获取图像大小，但如果在后台加载它并等待它，您将能够访问该信息。 e.g。

$.imageSize('http://www.nasa.gov/images/content/511786main_image_1848_946-710.jpg',function(i,w,h){
    alert(i+'\r\n'+w+'x'+h);
});

Answer 3

getimagesize应该可以解决这个问题，请查看更多文档http://php.net/manual/en/function.getimagesize.php

Answer 4

如果您使用Prototype Javascript library：

var img = new Element(
 'img', {
  src: 'image.jpg'
 }
);

img.observe(
 'load',
 function(event) {
  alert(
   Event.element(event).getWidth() + 
   'x' + 
   Event.element(event).getHeight()
  );
 }
);

$$('body').first().appendChild(img);
img.remove();

Answer 5

如果img标签没有宽度和高度属性，并且css没有为其定义样式宽度和高度，则图像将以“自然”大小呈现。

Answer 6

如果你没有指定高度和宽度，img标签将以正确的大小显示图像

以下将显示mypic.jpg全尺寸

<img src='mypic.jpg' >

或者这将显示宽度为200px且高度为

的图像

<img src='mypic.jpg' width="200px" >

获取上传的图片宽度;加载实际图像大小的高度

6 个答案: