ajax异步验证用户名

最新推荐文章于 2020-11-27 08:58:47 发布

shaonianbz

最新推荐文章于 2020-11-27 08:58:47 发布

阅读量920

点赞数 1

分类专栏： JavaEE 文章标签： ajax 异步用户名验证邮箱验证

本文链接：https://blog.csdn.net/shaonianbz/article/details/78566647

版权

JavaEE 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

ajax异步验证代码

注册时验证注册的用户名(邮箱等)是否存在

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/myJS.js"></script>
<title>Insert title here</title>
    <script type="text/javascript">
        window.onload=function(){
            var nameElement = document.getElementsByName("userName")[0];
            nameElement.onblur = function(){
                var name = this.value;//this等价于nameElement
                //创建XMLHttpRequest对象
            var xhr = getXMLHttpRequest();
            //处理结果
            xhr.onreadystatechange = function(){
                if(xhr.readyState==4){//请求一切正常
                    if(xhr.status==200){//服务器响应一切正常
                        //alert(xhr.responseText);//得到响应结果
                        var msg = document.getElementById("msg");
                        if(xhr.responseText=="true"){
                            msg.innerHTML =  "<font color='red'>用户名已存在</font>";
                            //msg.innerText = "<font color='red'>用户名已存在</font>";
                        }else{
                            msg.innerHTML = "可以使用";
                        }
                    }
                }
            }

            //创建连接
            xhr.open("get","${pageContext.request.contextPath }/servlet/ckNameServlet?name="+name.value);
            //发送请求
            xhr.send(null);
            }

        }
    </script>
</head>
<body>
        用户名：<input type="text" name="userName" /><span id="msg"></span><br/>
        密码<input type="password" name="pwd"/><br/>
</body>
</html>

Servlet中处理提交表单

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class CkNameServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        PrintWriter out = response.getWriter();
        String name = request.getParameter("name");
        //模拟数据库
        if("tom".equals(name)){
            //如果用户名为tom则返回true
            out.print(true);
        }else{
            out.print(false);
        }
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }

}

shaonianbz

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
ajax异步验证用户名

ajax异步验证代码注册时验证注册的用户名(邮箱等)是否存在<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.or
复制链接

扫一扫