限制输入字段上图像的宽度和高度

Question

是否可以通过使用html、css和javascript/jquery来限制输入字段上图片的宽度和高度？我试图将其限制为个人资料照片上传(需要照片是完美的正方形，例如200x200、300x300(

Answer 1

PHP有一个名为getimagesize((的函数。

list($width, $height, $type, $attr) = getimagesize("img.jpg");

如文件中所示：http://php.net/manual/en/function.getimagesize.php

所以，在提交到数据库之前，只需检查高度和宽度

Answer 2

您可以通过从上传的文件创建图像来检查图像的高度和宽度。

$("#fileUploadForm").submit(function(e){
var window.URL = window.URL || window.webkitURL;
var fileInput = $(this).find("input[type=file]")[0],
file = fileInput.files ? fileInput.files[0] : null;
if( file ) {
var img = new Image();
img.src = window.URL.createObjectURL( file );
img.onload = function() {
var width = img.naturalWidth,
height = img.naturalHeight;
window.URL.revokeObjectURL( img.src );
if( width == height) {//perfect square
this.submit();
}
else {
//fail
}
};
}
});