js 圖片上傳預覽，驗證圖片類型、大小

HTML頁面

<div class="form-group">
	<label class="col-sm-2 control-label">頭像</label>
	<div class="col-sm-10">
		<div style="width: 200px; height: 110px; float: left;"><input id="image" name="image" type="file" multiple value=""/></div>
		<div style="height: 110px; float: left;"><img id="img0" src="__PUBLIC__/Admin/img/add_pic.png" style="height: 100px"/></div>
		 <span style="color:#f14d4d;margin-left:20px">建議圖片尺寸：寬 × 高 = 294 × 294 像素</span>
	</div>
</div>
<script type="text/javascript">
	//頭像
	$("#image").change(function () {
		var file = $(this).context.files[0];
		var exts = ['jpg','jpeg','png'];
		var maxSize = 2;
		if(file!=undefined){
			var suffix = file.name.substr(file.name.lastIndexOf('.')+1); //上傳文件類型
			var size = (file.size / 1024 / 1024).toFixed(2); //上傳文件大小，單位M
			if($.inArray(suffix,exts)=='-1'){
				layer.msg("請上傳jpg、jpeg或png格式的圖片",{icon:2});
				$("input[name='image']").val("");
				return false;
			}
			if(size>maxSize){
				layer.msg("請上傳2M以下的圖片",{icon:2});
				$("input[name='image']").val("");
				return false;
			}
			
			var objUrl = getObjectURL(this.files[0]);
			if (objUrl) {
				$("#img0").attr("src", objUrl);
			}
		}else{
			$("#img0").attr("src", "__PUBLIC__/Admin/img/add_pic.png");
		}
	});
	
	function getObjectURL(file) {
		var url = null;
		if (window.createObjectURL != undefined) {
			url = window.createObjectURL(file);
		} else if (window.URL != undefined) {
			url = window.URL.createObjectURL(file);
		} else if (window.webkitURL != undefined) {	
			url = window.webkitURL.createObjectURL(file);
		}
		return url;
	}
</script>

PHP頁面，TP3.2

if(!empty($_FILES)){
	$upload = new \Think\Upload();// 實例化上傳類
	$upload->maxSize = 2097152;// 設置附件上傳大小 2M
	$upload->exts = array('jpg', 'png', 'jpeg');// 設置附件上傳類型
	$upload->rootPath = './Uploads/member/'; // 設置附件上傳根目錄
	$upload->savePath = ''; // 設置附件上傳（子）目錄
	$upload->saveRule = 'time';
	$info = $upload->upload();
	
	//頭像
	if(isset($info['image'])){
		$data['head_img'] = '/Uploads/member/'.$info[image][savepath].$info[image][savename];
		//生成縮略圖
		$thumb = new \Think\Image();
		$thumb->open($_SERVER['DOCUMENT_ROOT'].$data['head_img']);
		$thumb->thumb(294,294,\Think\Image::IMAGE_THUMB_FIXED)->save($_SERVER['DOCUMENT_ROOT'].$data['head_img']);
	}elseif(!empty($_FILES['image']['name']) && !isset($info['image'])){
		$this->ajaxReturn(['status' => 0, 'info' => $upload->getError()]);
	}
}