springmvc中ajax传值问题

第一种传值

从前端传值到后端

    <script type="text/javascript">
        $(function () {
           $(":input[name='username']") .change(function () {
              var val=$(this).val();
              val=$.trim(val);
              if (val !=""){
                  var url="${pageContext.request.contextPath}/valiateUserName";
                  var args={"userName":val,"time":new Date()};
                  $.post(url,args,function (data) {
                     $("#msg").html(data);
                  });
              }
           });
        });
    </script>

前端接收后端传过来的值，方式有几种

方式一：

    @RequestMapping("/valiateUserName")
    public void validateUserName(HttpServletRequest request){
        List<String>userName=new ArrayList<String>();
        userName.add("AAA");
        userName.add("BBB");
        userName.add("CCC");
        System.out.println(request.getParameter("userName"));

    }

方式二：

    @RequestMapping("/valiateUserName")
    @ResponseBody
    public String validateUserName(@RequestParam("userName") String username,@RequestParam("time") Date time) {

//        List<String>userName=new ArrayList<String>();
//        userName.add("AAA");
//        userName.add("BBB");
//        userName.add("CCC");
        System.out.println(time);
        return "success";

    }

要注意的是userName和time要与前端的参数对应的话@RequestParam(“userName”)可以省去。

第二种传值

从前端传递到后端

                var URL="${pageContext.request.contextPath}/valiateUserName";
                var args={"userName":val,"password":"123"};

                $.ajax({
                    type:"post",
                    url:"${pageContext.request.contextPath}/valiateUserName",
                    data:JSON.stringify(args),//将json格式的数据转化成字符串形式发送到后端
                    contentType: 'application/json;charset=utf-8',//发送给服务器的数据格式
                    success(data){
                        alert(data);
                    }

                });

• 值得注意的是：JSON.stringify(args)和contentType: 'application/json;charset=utf-8’保证传递到后端的json是字符串格式的。
• 用此种方法后端不能用上面两种方法获取前端发送过来的值

后端接收从前端发送过来的值

方式一：用Map接收

    @RequestMapping("/valiateUserName")
    @ResponseBody
    public String validateUserName(@RequestBody Map<String,String> getData) {

//        List<String>userName=new ArrayList<String>();
//        userName.add("AAA");
//        userName.add("BBB");
//        userName.add("CCC");
        //1、已经从前端获取要查询的数据,并将这些数组分离装在集合里
        ArrayList<String> list=new ArrayList<String>();
        for(String key:getData.keySet()){
            String value=getData.get(key);
            list.add(value);
        }
        System.out.println(list.toString());
        return "success";

    }

方式二：用gson封装成一个对象

    @RequestMapping("/valiateUserName")
    @ResponseBody
    public String validateUserName(@RequestBody String json) {//一定要加上的@RequestBody注解
    //json为：{"userName":"admin","password":"123"}
//        List<String>userName=new ArrayList<String>();
//        userName.add("AAA");
//        userName.add("BBB");
//        userName.add("CCC");
        LoginVO vo=gson.fromJson(json,LoginVO.class);

        System.out.println(vo.getUserName());
        return "success";

    }

需要注意的是：首先要导入Gson的依赖：

        <dependency>
            <groupId>com.google.code.gson</groupId>
            <artifactId>gson</artifactId>
            <version>2.2.4</version>
        </dependency>

LoginVO是一个实体，这样就可以把前端传过来的json转化成对象了。

前端接收后端返回的json字符串

                    success(data){
                        var txtObj = eval("("+data+")");//用eval解析json字符串
                        alert(txtObj.userName);
                    }

将java对象转化成json对象

        //将java对象转化成json
        LoginVO loginVO=new LoginVO();
        loginVO.setUserName("ranqing");
        loginVO.setPassword("123");
        String str=gson.toJson(loginVO);
        System.out.println(str);

        return json;