复杂文件上传ajax

JAVA代码

@RequestMapping("/upload")
    @ResponseBody
    public String upload(HttpServletRequest request,
            @RequestParam("userName") String userName,
            @RequestParam("eat") String eat,
            @RequestParam("sex") String sex
            ){
        System.out.println(sex);
        RspUserBean re=new RspUserBean();
        String ss[]=eat.split(",");
        re.setUserHobby(ss);
        String hob[]=re.getUserHobby();
        for (String string : hob) {
            System.out.println(string);
        }
        MultipartHttpServletRequest files=(MultipartHttpServletRequest)request;
         Map<String, MultipartFile> maps=files.getFileMap();
        System.out.println(userName);
        System.out.println(maps);
         for (MultipartFile mm : maps.values()) {
            System.out.println(mm.getOriginalFilename());
        }
         
        return "secc.jsp";
    }

js代码

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/ajaxfileupload.js"></script>
<title>Insert title here</title>
</head>
<body>
    <form action="" enctype="multipart/form-data" method="post">
        name:<input type="text" name="userName" id="userName" /><br/><br/>
        file1:<input type="file" name="file" id="file1" /><br/><br/>
        file2:<input type="file" name="file" id="file2" /><br/><br/>
        hobby:<input type="checkbox" name="eat" value="eat" />eat
              <input type="checkbox" name="eat" value="paly" />paly
              <input type="checkbox" name="eat" value="hah" />hah
        <br/><br/>
        sex:<input type="radio" name="sex" value="0" />man
            <input type="radio" name="sex" value="1" />woman<br/><br/>
        are:<select name="are">
                <option value="南京">南京</option>
                <option value="苏州">苏州</option>
            </select><br/><br/>
            <input type="submit" value="login" />
            <input type="reset" value="clear" />
    </form>
</body>
<script type="text/javascript">
    $(function(){
        $("form").submit(function(){
            login();
            return false;
        });
        
        function login(){
            var temp1="";
            var rr=$(":radio");
            rr.each(function(i,v){
                if(v.checked){
                    temp1=$(v).val();
                }
            });
            var temp="";
            var c=$(":checkbox");
            c.each(function(i,v){
                if(v.checked){
                    temp+=$(v).val()+",";
                }
            });
            temp=temp.substring(0, temp.lastIndexOf(","));
             $.ajaxFileUpload
                (
                    {
                        url: '${pageContext.request.contextPath}/test/upload', //用于文件上传的服务器端请求地址
                        fileElementId: 'file1', //文件上传域的ID
                        dataType: 'json', //返回值类型 一般设置为json
                        data:{'userName':$("#userName").val(),"eat":temp,"sex":temp1},
                        success: function (data, status)  //服务器成功响应处理函数
                        {
                           alert("123");
                        },
                        error: function (data, status, e)//服务器响应失败处理函数
                        {
                            alert("456");
                        }
                    }
                )
        }
    });
</script>
</html>
原文地址:https://www.cnblogs.com/javaweb2/p/6591681.html