springmvc通过ajax上传文件/图片到工程中

src内放设置自定义在网上寻找一张意为添加的图片,放入工程某目录下

<div class="picture">
<img onclick="select(this)" src="theme/addpi/addpicture.jpg" name="picture" id="big_img1" width="418" height="418">
</div>

隐藏文件选择标签,是为了美化界面界面,下图仅做演示,非本文代码全部实现

<div hidden="hidden">
<form name="Form2"  id="form2" action="fileupload3" method="post"  enctype="multipart/form-data"> //切记要加enctype="multipart/form-data",这是文件上传所设置的格式 且必须是post格式
<input type="file" name="file"  id="f1" hidden="hidden" >
</form> 
</div>

在这里插入图片描述

js+jq函数点击事件

function select(obj)//obj为被点击的对象,这个对象默认为js表示
{
	$("#f1").val("");//要将之前的文件清空正在选择选择新的,避免原来已选过影响数据的传递
	$('#f1').click();//模拟文件选择的点击事件
 var select=document.getElementById("f1");
        select.onchange=function(){//ajax向后台传送文件数据
	   var formData = new FormData(form2);
	 	 $.ajax({  
	         url: 'fileupload3' ,  
	         type: 'POST',  
	         data: formData,
	         contentType: false,  
	         processData: false,
	         success: function (returndata) {  
	        	obj.setAttribute("src",returndata);
	         } 
	    });   
	}
}

springmvc的控制器方法

每次选择将图片保存到工程某目录下,然后通过ajax回写到jsp页面去显示

@RequestMapping("fileupload3")
    @ResponseBody
    public String  fileupload(HttpServletRequest request,HttpServletResponse response) throws Exception {
        //获取服务器中保存文件的路径
     String path = request.getSession().getServletContext().getRealPath("")+"\\theme\\addpi\\";
     String localPaths="theme\\addpi\\";
      //获取解析器  
        CommonsMultipartResolver resolver = new CommonsMultipartResolver(request.getSession().getServletContext());  
        //判断是否是文件  
        System.out.println(resolver.isMultipart(request));
        if(resolver.isMultipart(request)){  
            //进行转换  
            MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest)(request);  
            //获取所有文件名称  
            Iterator<String> it = multiRequest.getFileNames();  
            while(it.hasNext()){  
            	
                //根据文件名称取文件  
                MultipartFile file = multiRequest.getFile(it.next().toString());  
                String fileName = UUID.randomUUID()+file.getOriginalFilename();  
                System.out.println(fileName);
                 String localPath = path + fileName;  
                 localPaths+=fileName;
                //创建一个新的文件对象,创建时需要一个参数,参数是文件所需要保存的位置
                File newFile = new File(localPath);  
                if (newFile.getParentFile() != null || !newFile.getParentFile().isDirectory()) {
                   // 创建父文件夹
                   newFile.getParentFile().mkdirs();
                }
                //上传的文件写入到指定的文件中   
                file.transferTo(newFile); 
               }
    }
        return localPaths;
    }
发布了20 篇原创文章 · 获赞 10 · 访问量 5473

猜你喜欢

转载自blog.csdn.net/weixin_43784880/article/details/89929145