标签：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Ajax</title> <script language="javascript"> //<script language="javascript" type="application/javascript"> // 如果上方的代码不能够完整实现就使用这个 //IE浏览器实例化方式 //var h = new ActiveXObject("Msxml2.XMLHTTP"); //var p = new ActiveXObject("Microsoft.XMLHTTP"); //非IE浏览器 //var f = new XMLHttpRequest(); //alert(p.getAllResponseHeaders()); var hx = false; //定义函数 function test(user_id) { //所有浏览器通用实例化代码 if(window.XMLHttpRequest) //非IE IE7版本及以上 都支持非ie形式 { hx = new XMLHttpRequest(); //如果是非IE浏览器 那么就会实例化 // alert("qqq"); //如果是实例化成功上方的，那么就会输出这句话 } else if(window.ActiveXObject) //IE { try{ hx = new ActiveXObject("Msxml2.XMLHTTP"); //实例化 // alert("qqq2"); //如果实例化成功上方的 那么就会输出这句话 } catch(e) { alert(e); try { hx = new ActiveXObject("Microsoft.XMLHTTP"); //实例化 // alert("qqq3"); //如果实例化成功上方的 那么就会输出这句话 } catch(e) { alert(e); } } } //测试创建XMLHttpRequest是否成功 if(!hx) { alert("创建XMLHttpRequest失败"); } else { alert("创建XMLHttpRequest成功"); } //异步请求的请求类型有两种方式 一种是 get 另一种是 post 两种方法都有各自的方式 //get方式 alert(new Date().getTime()); // 1 设置异步请求的url等信息 hx.open("GET","ajaxtest?userid=" + user_id + "&nocache = " + new Date().getTime() , true); //（"请求类型 GET/POST",URL,是否异步 true/false） // 2 设置回调函数 事件处理器 hx.onreadystatechange = function() //匿名函数 { getResult("1"); } // hx.onreadystatechange = getResult; //将回调函数的函数名作为一个事件处理器给 hx.onreadystatechange //调用请求的发送 hx.send(null); //在需要请求传送参数时设置异步请求时用 post 方式 } //回调函数 function getResult(type) // function getResult() { // //alert("readyState = "+hx.readyState); if(hx.readyState == 4) //判断是否完成 { if(hx.status == 200) //判断服务器是否完成，正常 { // alert("回调信息 = " + hx.responseText); //返回的值 alert(hx.responseText); alert(type); // alert("Headers = " + hx.getAllResponseHeaders()); //获取返回函数的全部头信息 // alert("Server = " + hx.getResponseHeader("Server")); //获取部分头信息--回调信息 } else { alert("错误状态码 = " + hx.status + "状态文本信息 = " + hx.statusText); } } } /* //post方式 // 1 设置异步请求的url等信息 hx.open("POST","ajaxtest",true); //（"请求类型 GET/POST",URL,是否异步 true/false） // 2 设置回调函数 事件处理器 hx.onreadystatechange = function() //匿名函数 { getResult("1"); } // hx.onreadystatechange = getResult; //将回调函数的函数名作为一个事件处理器给 hx.onreadystatechange //调用请求的发送 //在需要请求传送参数时设置异步请求时用 post 方式 hx.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //post方式 数据传输 get方式可以直接放置于URL中 hx.send("userid=" + user_id); } //回调函数 function getResult(type) { // //alert("readyState = "+hx.readyState); if(hx.readyState == 4) //判断是否完成 { if(hx.status == 200) //判断服务器是否完成，正常 { // alert("回调信息 = " + hx.responseText); //返回的值 alert(hx.responseText); // alert("Headers = " + hx.getAllResponseHeaders()); //获取返回函数的全部头信息 // alert("Server = " + hx.getResponseHeader("Server")); //获取部分头信息--回调信息 } else { alert("错误状态码 = " + hx.status + "状态文本信息 = " + hx.statusText); } } } */ //alert("Server = " + hx.getAllResponseHeaders("Server")); </script> </head> <body> 用户代码:<input type="text" onchange="test(this.value);" /> </body> </html>
package com.hanqi; import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * Servlet implementation class ajaxtest */ @WebServlet("/ajaxtest") public class ajaxtest extends HttpServlet { private static final long serialVersionUID = 1L; /** * Default constructor. */ public ajaxtest() { // TODO Auto-generated constructor stub } /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); response.setContentType("text/html; charset=utf-8"); String userid = request.getParameter("userid"); if(userid != null && userid.trim().length() > 0) { //查找用户信息 if(userid.equals("abc")) { response.getWriter().append("用户代码已存在！"); } else { response.getWriter().append("用户代码不存在，可以使用！"); } } else { response.getWriter().append("请正确填写！"); } response.getWriter().append("test ajax"); response.getWriter().append("Served at: ").append(request.getContextPath()); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub doGet(request, response); } }
标签：
原文地址：http://www.cnblogs.com/name-hanlin/p/5055371.html
