console
$(function(){
$('#upload').change(function(e){
console.log(e)
let imgInfo = e.target.files[0];
$('#name').html(imgInfo.name)
$('#size').html(imgInfo.size / 1024)
$('#type').html(imgInfo.type)
$('#lastTime').html(Date.parse(imgInfo.lastModifiedDate))
if(imgInfo.size/(1024 * 1024) > 1){
alert('上传图片不能大于1M');
return ;
}
if(!/\.(jpg|png)/.test(imgInfo.name)){
alert('上传图片类型jpg,png');
return ;
}
let windowURL = window.URL || window.webkitURL;
let imgsrc = windowURL.createObjectURL(imgInfo);
$('#img').attr('src',imgsrc);
let _img = new Image();
_img.onload = function(){
let imgW = _img.width,
imgH=_img.height;
if(imgW!= 200 || imgH != 200){
alert('请上传200px * 200px 图片');
return false;
}
};
_img.src = imgsrc;
let formData = new FormData();
formData.append('file', imgInfo);
$.post('url',formData,function(data){
});
});
});
<input id="upload" type="file" accept="image/gif, image/png, image/jpg, image/jpeg">
<div>
<p>文件信息:</p>
<p><img id="img" style="width:100px;"></p>
<p>文件名:<span id="name"></span> </p>
<p>文件大小:<span id="size"></span>KB</p>
<p>文件类型:<span id="type"></span></p>
<p>最后修改时间:<span id="lastTime"></span>(时间戳)</p>
</div>