SSM+图片选择显示

一、功能实现

     
用户照片:
     

          
     
     

          
     




//选择照片
    	
        
        var imgReaderI = new FileReader();
        regexImageFilter = /^(?:image\/bmp|image\/png|image\/jpeg|image\/jpg)$/i;
        //文件读取 onload事件
        imgReaderI.onload = function (evt) {
            $("#IimgStudentPicture").attr("src", evt.target.result);
            $("#modalimg").attr("src",evt.target.result);
        };
        $("#IStudentPicture").change(function () {
			
			var IStudentPictureVal = $("#IStudentPicture").val().trim();
			if(IStudentPictureVal == "" && IStudentPictureVal == null){
				 $("#IimgStudentPicture").attr("src", "");
			}
			
            var imgfFile = $("#IStudentPicture").prop('files')[0];
            if (!regexImageFilter.test(imgfFile.type)) {
                layer.alert('选择的不是一个有效的图片文件', { icon: 6 });
            }else if (imgfFile.size >= 4 * 1024 * 1024) {
				layer.alert("图片文件不能大于4MB");
				$("#IStudentPicture").val("");
				return false;
			}else{
				imgReaderI.readAsDataURL(imgfFile);
			}
        });


Form表单中form标签中请加上 ： enctype=\"multipart/form-data\" （是关于文件传输的）

//Java Servlet中加上判断
if (!ServletFileUpload.isMultipartContent(req)) {
			System.out.println("Error:表单必须包含enctype=\"multipart/form-data\"");
			resp.getWriter().write("fail");
			//jsonReturn.setMsg("Error:表单必须包含enctype=\"multipart/form-data\"");
		} else{
		
}