springmvc+jquery+ajax实现异步用户名验证

最新推荐文章于 2017-08-12 16:54:47 发布

diu_brother

最新推荐文章于 2017-08-12 16:54:47 发布

阅读量7.5k

点赞数 4

分类专栏： ajax 文章标签： jquery ajax spring mvc

本文链接：https://blog.csdn.net/diu_brother/article/details/48296891

版权

ajax 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

怕自己忘记，把写过的代码记录一下
直接上源码：
login.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>登陆验证</title>
<link rel="stylesheet" href="bootstrap/bootstrap.min.css">
<script src="bootstrap/jquery.min.js"></script>
<script src="bootstrap/bootstrap.min.js"></script>
<link href="CSS/index.css" rel="stylesheet">
<script type="text/javascript" src="scripts/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(function() {
        var flag1 = false;
        var flag2 = false;
        $("#inputName")
                .blur(
                        function() {
                            var inputName = $("#inputName").val();
                            if ($.trim(inputName) == ''
                                    || $.trim(inputName).length < 5
                                    || $.trim(inputName).length > 15) {
                                $("#userspan")
                                        .html(
                                                "<font color='red'>用户名不能为空，且用户名长度为5-15</font>");
                                flag1 = false;
                            } else {
                                var inputPassword = $("#inputPassword").val();
                                var url = "${pageContext.request.contextPath}/validateUser";
                                var args = {
                                    "name" : $.trim(inputName),
                                    "password" : $.trim(inputPassword)
                                };
                                $
                                        .post(
                                                url,
                                                args,
                                                function(data) {
                                                    if ($.trim(data) == "error") {
                                                        $("#userspan")
                                                                .html(
                                                                        "<font color='red'>此用户名已存在</font>");
                                                        flag1 = false;
                                                    } else if ($.trim(data) == "success") {
                                                        $("#userspan").html(
                                                                "用户名可用").css({
                                                            color : 'green'
                                                        });
                                                        flag1 = true;
                                                    }
                                                })
                            }

                        });
        $("#inputPassword").blur(
                function() {
                    var inputPassword = $("#inputPassword").val();
                    if ($.trim(inputPassword) == "") {
                        $("#pswspan").html("<font color='red'>密码不能为空</font>");
                        flag2 = false;
                    } else if ($.trim(inputPassword).length > 15
                            || $.trim(inputPassword).length < 5) {
                        $("#pswspan").html("密码长度必须为5-15").css({
                            color : "red"
                        });
                        flag2 = false;
                    } else {
                        $("#pswspan").html("密码可用").css({
                            color : "green"
                        });
                        flag2 = true;
                    }

                })

        $("#formButton").click(function() {
            if (flag1 && flag2) {
                $("#form").submit();
            }
            return false;
        })

    });
</script>
</head>
<body>
    <div class="container">
        <h2 class="form-signin-heading">注册页面</h2>
        <form action="insertUser" id="form">
            <label for="inputName" class="sr-only">用户名</label> <input type="text"
                id="inputName" name="inputName" class="form-control"
                placeholder="请输入学号" required autofocus> <span id="userspan"></span>
            <label for="inputPassword" class="sr-only">密码</label> <input
                type="password" id="inputPassword" name="inputPassword"
                class="form-control" placeholder="请输入密码" required> <span
                id="pswspan"></span>
            <p class="text-primary">
                <a href="login">直接登录</a>
            </p>
            <button class="btn btn-lg btn-primary btn-block" type="button"
                id="formButton">注册</button>
        </form>
    </div>
</body>
</html>

controller层

@RequestMapping("/validateUser")
    public void validateUser(HttpServletRequest request,
            HttpServletResponse response) throws Exception {
        String name = request.getParameter("name");
        response.setContentType("text/html");
        response.setCharacterEncoding("utf-8");
        PrintWriter out = null;
        out = response.getWriter();
        List<User> userList = userDao.queryUserList(0);
        boolean flag = true;
        for (User user : userList) {
            String uname = user.getName();
            if (name.equals(uname)) {
                flag = false;
            }
        }
        if (flag) {
            out.println("success");
        } else {
            out.println("error");
        }
    }

domain层

package com.sinaapp.whu13ds.entities;

public class User {
    private Integer id;
    private String name;
    private String password;

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    @Override
    public String toString() {
        return "User [id=" + id + ", name=" + name + ", password=" + password
                + "]";
    }

    public User() {
        super();
    }

    public User(Integer id, String name, String password) {
        super();
        this.id = id;
        this.name = name;
        this.password = password;
    }

}