html 前端往后端传值，成功案例$.ajax

第一种案例（方法的中的返回结果 自己定义，随便写一个  测试用不要也可以，）

@RequestMapping(value = "/add", method = RequestMethod.POST)
    public AjaxResult add(@RequestBody User user) {
        IPage page = new Page(1,5);
        page.setPages(1);


        log.info("------------>{}",user);  // 测试能否获取到前端的user对象\


        try {
            if (user.getUname() == null) {
                return new AjaxResult(AjaxResult.Type.ERROR,"请填写名字");
            }
            int i = userService.insertUser(user);
//            log.info("i,-----{}",i);
            if (1 == i) {
                //调用添加到redis的方法,
                redisSetData.testRedis(request,user.getUname(), user.getIdCard());
                return new AjaxResult(AjaxResult.Type.SUCCESS,"注册成功");
            }
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult(AjaxResult.Type.WARN,"系统异常");
        }
        return new AjaxResult(AjaxResult.Type.WARN,"已经注册过了！");

前端

  var o1 ={

                "uname":auname,"sex":sex,"uage":uage,"high":high,"idCard":f,"zongmen":zongmen,

                "hunhuan":hunhuan,"dengji":dengji,"chenghao":chenghao,"location":location,

                "longitude":longitude,"latitude":latitude,"bankNum":bankNum

            };

            // console.log("1111111"+bankNum);

            $.ajax({

                data:JSON.stringify(o1),

                type:"POST",

                url:"http://localhost:8888/add",

                dataType:"JSON",

                contentType: 'application/json;charset=UTF-8',

                success:function(v) {

                    alert("添加成功");

                    return;

                },

                error:function() {

                    alert("添加失败，刷新");

                }

            })

        }

第二种传输方式

@Desensitization
    @RequestMapping(value = "/getpage",method = RequestMethod.GET)
    //分页查询
    public List<User> findByPage(@RequestParam("mess") String mess,
                                 @RequestParam("targetPageNum") Integer targetPageNum) {


//        log.info("--------{},{}",mess,targetPageNum);


        try {
            List<User> byPage = userService.findByPage(mess, targetPageNum);
            System.out.println(byPage);
            return byPage;
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        }




    }

前端

function queryMesshdskahdfalkhdlkjsa() {

            var mess = $("#queryMess").val();

            // console.log(">>>>>>>>>>>>>>>"+mess);

            var targetPageNum = $("#nowPage").val();

            // console.log(">>>>>>>>>>>>>>>"+targetPageNum);

            // var papers = {"mess":mess,"targetPage":targetPageNum};

            // console.log(papers);

            $("#tb").empty();

            $.ajax({

                url:"http://localhost:8888/getpage",

                type:"GET",

                data:{

                    "mess":mess,

                    "targetPageNum": targetPageNum

                },

                contentType: 'application/json;charset=UTF-8',

                dataType:"json",

                success:function(val) {

                    alert("23");

                    console.log(val);

                    $.each(val,function(i,obj){

                    // console.log(obj);

                    var chat = "<tr>"

                        +"<td>" + obj.uid + "</td>"

                        +"<td>" + obj.uname + "</td>"

                        +"<td>" + obj.sex + "</td>"

                        +"<td>" + obj.uage + "</td>"

                        +"<td>" + obj.high + "</td>"

                        +"<td>" + obj.idCard + "</td>"

                        +"<td>" + obj.zongmen + "</td>"

                        +"<td>" + obj.hunhuan + "</td>"

                        +"<td>" + obj.dengji + "</td>"

                        +"<td>" + obj.chenghao + "</td>"

                        +"<td>" + obj.location + "</td>"

                        +"<td>" + obj.longitude + "</td>"

                        +"<td>" + obj.latitude + "</td>"

                        +"<td>" + obj.bankNum + "</td>"

                        // +"<td><button type='submit' data-toggle='modal' data-target='#updateUser' οnclick='update()'>编辑"

                        // +"</button><button class='btn btn-danger btn-sm' οnclick='delData()'>删除"

                        // +"</button><button class='btn btn-info btn-sm'>附近的人</button></td>"

                        +"</tr>";

                        $("#tb").append(chat);

                });

                }

            })

        }

第三种

@RequestMapping(value = "/regi", method = RequestMethod.POST)
public AjaxResult regist(@RequestBody Admin admin) {
    log.info("测试{}", admin);
    try {
        int add = adminService.add(admin);
        if (1 == add) {
            redisSetData.testRedis(request,admin.getUsername(), admin.getIdcard());
            return new AjaxResult(AjaxResult.Type.SUCCESS,"注册成功！");
        }
    } catch (Exception e) {
        throw new RuntimeException(e);
    }


    return new AjaxResult(AjaxResult.Type.ERROR,"账号已经被注册");
}

//注册函数

  function register() {

            //获取注册的值

    var username = $("#inputuname").val();  //姓名

    // alert(username);

    var passwd = $("#inputpassword").val(); //密码

    var repasswd = $("#reinputpassword").val(); //确认密码

    var idcard=$("#inputIdCard").val(); // 身份证号

    var sexs=document.getElementById("man").checked;        //性别

        if (sexs==true) {

            sexs=$("#man").val();

        }else {

            sexs=$("#girl").val();

        }

        console.log(sexs);

        let o = {"username":username,"passwd":passwd,"idcard":idcard,"sex":sexs};

    $.ajax({

        data:JSON.stringify(o),

        url:"http://localhost:8888/regi",

        type:"POST",

        contentType: 'application/json;charset=UTF-8',

        success:function(v) {

            alert(v);

            window.location.href="index.html";

        },

        error: function (error) {

}

    })

        }

第四种

//登录
    @RequestMapping(value = "/login", method = RequestMethod.POST)
    public AjaxResult login(@RequestParam("username") String username,
                            @RequestParam("passwd") String passwd,
                            HttpServletRequest request) {


        log.info("账号密码是{},{}",username,passwd );
        try {
            Admin admin = adminService.selectByUsernameAndPasswd(username, passwd);
            if (null !=admin) {
                String id = request.getSession().getId();
                request.getSession().setAttribute("uu",username);
//                System.out.println("=============");
                return new AjaxResult(AjaxResult.Type.SUCCESS,"登陆成功",username);
            }
        } catch (Exception e) {
            throw new RuntimeException(e);
        }


        return new AjaxResult(AjaxResult.Type.ERROR,"账号或密码错误，请注册后登录！");
    }

 

前端

//登录函数

        function loginms() {

            var a=$("#inputEmail3").val();

            var b=$("#inputPassword3").val();

            // console.log(a+b);

            if(a=="" || a==null || b=="" || b==null) {

                alert("不填还想进去，没门");

                return;

            }else{

                // let c = {"username":a,"passwd":b}

                $.ajax({

                    data:{"username":a,"passwd":b},

                    url:"http://localhost:8888/login",

                    type:"POST",

                    // contentType: 'application/json;charset=UTF-8',

                    dataType:"JSON",

                    success:function(v) {

                    alert("欢迎尊敬的"+v.data);          

                    var s=document.getElementById("denglu").innerHTML="欢迎尊贵的"+v.data+"";

                    console.log(s);

                    window.location.href="index.html";

                   

        },

                })

            }

        }