JavaWeb 期末大作业 管理系统 登录表单 实现检测用户名是否被注册

具体思路是JS监听input修改时间，当修改事件发生时，jquery的ajax获取当前input值，并向后端的接口 /checkLogin 发送请求来校验，并根据获取的json结果的success字段判断是否合法。

前端

为 Parsley 添加一个自定义的验证器

window.ParsleyValidator  
        .addValidator('username', function (value, requirement) {  
          console.log(value);  
          console.log(requirement);  
          var response = false;  
  
          $.ajax({  
            url: "/checkLogin",  
            data: {username: value},  
            dataType: 'json',  
            type: 'post',  
            async: false,  
            success: function(data) {  
              if(data.success)  
                response = true;  
              else  
                response = false;  
            },            error: function() {  
              response = false;  
            }          });          return response;  
        }, 32)  
        .addMessage('en', 'username', 'The username already exists.')  
        .addMessage('zh-cn', 'username', '用户名不存在')

然后添加到 input 字段，并设置当修改时触发 Parsley 的校验：

<input type="username" class="form-control" id="username" placeholder="请输入您的用户名" required="" data-parsley-trigger="change" data-parsley-username="">

后端

只需要配置一个接口即可，根据传入的username来查数据库，如果查得到就说明存在，查不到就不存在。