html5上传图片修改大小,HTML5在上传前预先调整图片大小

是的，使用

File API，然后可以使用

canvas element处理图像。

// from an input element

var filesToUpload = input.files;

var file = filesToUpload[0];

var img = document.createElement("img");

var reader = new FileReader();

reader.onload = function(e) {img.src = e.target.result}

reader.readAsDataURL(file);

var ctx = canvas.getContext("2d");

ctx.drawImage(img,0);

var MAX_WIDTH = 800;

var MAX_HEIGHT = 600;

var width = img.width;

var height = img.height;

if (width > height) {

if (width > MAX_WIDTH) {

height *= MAX_WIDTH / width;

width = MAX_WIDTH;

}

} else {

if (height > MAX_HEIGHT) {

width *= MAX_HEIGHT / height;

height = MAX_HEIGHT;

}

}

canvas.width = width;

canvas.height = height;

var ctx = canvas.getContext("2d");

ctx.drawImage(img,width,height);

var dataurl = canvas.toDataURL("image/png");

//Post dataurl to the server with AJAX