[JavaScript知识库]jquery ajax请求 springmvc controller的 例子。

前端代码：

//当 username 输入框的输入改变的时候，获取数值，查询数据库中是否已经存在
            $("#username").change(function () {
                var targetUrl ='http://localhost/check_username.do';
                console.log("请求地址是：" + targetUrl)
                $.ajax({
                    url: targetUrl,
                    data: {"username": $("#username").val()},
                    type: "GET",
                    dataType: "text",

                    success: function (data) {
                        console.log('ajax成功：',data)
                        if (data == 'success') {
                            $("#p1").html("");
                            console.log('可以注册')
                        } else {
                            $("#username").focus();
                            $("#p1").css("color", "red");
                            $("#p1").html("*用户名已存在");
                            console.log('用户名已存在')
                        }

                    },
                    error: function (data) {
                        // alert(data.status);
                        // alert(data.readyState);
                        // alert(data.responseText);
                        console.log('ajax失败',data)
                        if (data.responseText == 'success') {
                            $("#p1").html("");
                            console.log('可以注册')
                        } else {
                            $("#username").focus();
                            $("#p1").css("color", "red");
                            $("#p1").html("*用户名已存在");
                            console.log('用户名已存在')
                        }
                    }
                });
            });

后端例子：

//检查用户名重复
    @RequestMapping(value = "check_username", method = RequestMethod.GET)
    @ResponseBody
    public String check_username(String username) {
        System.out.println("进入 check_username.do请求");
        //向 前端页面传值的 几种方法
//        Model model;
//        Map<String, String> map;
//        HttpServletRequest request;
//        HttpSession session;
//        //方法一：用 request传参数
//        request.setAttribute("aaa","123");
//        System.out.println("request是："+request);
//        //方法二：用 session
//        map.put("username",username);
//        System.out.println("map是"+map);
//        session.setAttribute("map",map);
//        System.out.println("session 是："+session.getAttribute("map"));
//        //方法三：用 model
//        model.addAttribute("message","这是 model");
//        System.out.println("model 是"+model);
        if (userDao.showByUserName(username) == null) {
            return "success";
        } else {
            return "error";
        }
    }

笔记：@Reponsebody : @responseBody注解的作用是将controller的方法返回的对象通过适当的转换器转换为指定的格式之后，写入到response对象的body区，通常用来返回JSON数据或者是XML。在使用此注解之后不会再走spring mvc视图处理器，而是直接将数据写入到输入流中，他的效果等同于通过response对象输出指定格式的数据。
jquery 的 ajax dataType一定要写text，若是写json，controlller返回的数据很容易格式不对，进入error函数。