zoukankan      html  css  js  c++  java
  • SpringMVC上传图片

    1、前端H5

    <div class="container-fluid">
    		<!-- <div id="panel-advancedoptions"> -->
    			<div class="row">
    				<div class="col-md-12">
    					<div class="panel panel-midnightblue">
    						<div class="panel-heading">
    							<h2>修改头像</h2>
    						</div>
    						<div class="panel-body">
    								<div class="row">
    									<div class="col-md-1">
    										<button type="button" class="btn btn-primary btn-sm" id="btn_upload" >
    											<span class="fa fa-upload"></span> 上传头像图片
    										</button>
    									</div>
    									<div class="col-md-11">
    											<h5></h5>(仅限上传单张10M以下png、jpg图片)</h5>
    											<input type="file" class="hidden" id="InputFile" />
    									</div>
    								</div>
    								</br>
    								<div class="row">
    									<div class="col-md-6">
    										<img src="images/UserAvatars/robo.jpg" class="img-thumbnail uploadImges" >
    									</div>
    									
    								</div>
    						</div>
    					</div>
    				</div>
    			</div>
    			
    		<!-- </div> -->
    </div>
    

    2、JS

     $("#btn_upload").click(function(){
    				$("#InputFile").trigger("click");
                    openUploads("InputFile");
    			});
    			function openUploads(id){
    				$("#"+id).unbind().change(function(){
    					var formdata = new FormData();
    					formdata.append('file',$("#"+id)[0].files[0]); //获取图片信息
    					//console.log($("#"+id)[0].files[0]);
    					$.ajax({
    						type: 'POST',
    						url: "http://localhost:8078/lifeTrackDB/UploadUserAvatars",
    						data:formdata,
    						cache:false,
    						dataType: 'json',
    						processData:false,
    						contentType:false,
    						success : function (result)
    						{
    							console.log(result);
    							if (result.status)
    							{
    								//$('#'+id).attr('src','images/UserAvatars/'+result.message);
    								alert(result.message);
    							}
    							else
    							{
    								$.alert(result.message,'');
    							}
    						}
    					});
    				});
    			}
    

    3、JAVA后台

    @RequestMapping(value="/UploadUserAvatars")
    @ResponseBody
    public void UploadUserAvatars(HttpServletRequest request,HttpServletResponse response,
    			 @RequestParam(value = "file") List<MultipartFile> files) throws Exception{
    		
            String path=System.getProperty("user.dir");
           
    	if (null != files || 0 != files.size()) {  
    		for(MultipartFile file:files) {
    			//System.err.println("文件名:" + file.getOriginalFilename() + "---contentType:" + file.getContentType());  
    			file.transferTo(new File(path+"/UserAvatars/"+file.getOriginalFilename()));
    			response.getWriter().write("{"status": true, "code": "200","message":"上传成功"}");
    		}
            }else {
            	//response.getWriter().write("handleCallback({"status": false, "code": "200","message":"上传失败"})");
            	response.getWriter().write("{"status": false, "code": "200","message":"上传失败"}");
            }
    		
    }
    

      

  • 相关阅读:
    腾讯创业专题
    SP的新出路:亿美软通瞄准移动商务
    全球移动支付发展现状移动支付之综述篇
    C#开发终端式短信的原理和方法
    Windows CE的学习路线
    Linux Crontab 定时任务
    linux的中文man帮助
    PHP 变量与数组
    写商业计划书的几点心得 汉理资本钱学峰
    用PHP输出静态页面的两种方法
  • 原文地址:https://www.cnblogs.com/hzb462606/p/11414680.html
Copyright © 2011-2022 走看看