AJAX异步加载简单实现(Servlet)

XMLHttpRequest对象是实现AJAX的基础，所有浏览器中均内建XMLHttpRequest对象。

实现注册验证用户名

html脚本

<script type="text/javascript">
    function userNameAJAX(uerName) {
        var xmlhttp;
        if (uerName.value.length==0)
        {
            document.getElementById("userNameAJAX").innerHTML="";
            return;
        }
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("userNameAJAX").innerHTML=xmlhttp.responseText;
            }
        }
        var name=document.getElementById("userName").value;
        xmlhttp.open("GET","/RegisterAJAX?"+encodeURIComponent("userName")+"="+encodeURIComponent(name),true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send();
    }
</script>

服务器端servlet

@WebServlet("/RegisterAJAX")
public class RegisterAJAXServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException {
        doGet(request,response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
        System.out.println("发出请求了");
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html");

        String userName=request.getParameter("userName");
        System.out.println(userName);
        Dao dao=new Dao();
        if(dao.checkUserName(userName))
            response.getWriter().write("该用户名已被注册");
        else
            response.getWriter().write("用户名可用");
    }
}