<input type="text" id="userName" /> <input type="button" value="校验" onclick="verify()"/> <!--这个div用于存放服务器段返回的信息,开始为空--> <!--id属性定义是为了利用dom的方式找到某一个节点,进行操作--> <div id="result"></div> <!--div和span的直观差异,div中的内容独占行,span中的内容和前后其他内容相处良好--> function verify(){ //Jquery的查找节点的方式,参数中#加上id属性值可以找到一个节点。 //jquery的方法返回的都是jquery的对象,可以继续在上面执行其他的jquery方法 var jqueryObj = $("#userName"); //获取节点的值 var userName = jqueryObj.val(); //使用jquery的XMLHTTPrequest对象get请求的封装 $.ajax({ type: "POST", //http请求方式 url: "AJAXXMLServer", //服务器段url地址 data: "name=" + userName, //发送给服务器段的数据 dataType: "xml", //告诉JQuery返回的数据格式 success: callback //定义交互完成,并且服务器正确返回数据时调用的回调函数 }); } //回调函数 function callback(data) { // 接收服务器端返回的数据 // 需要将data这个dom对象中的数据解析出来 // 首先需要将dom的对象转换成JQuery的对象 var jqueryObj = $(data); // 获取message节点 var message = jqueryObj.children(); // 获取文本内容 var text = message.text(); // 将服务器段返回的数据动态的显示在页面上 // 找到保存结果信息的节点 var resultObj = $("#result"); // 动态的改变页面中div节点中的内容 resultObj.html(text); } public class AJAXXMLServer extends HttpServlet{ protected void doPost(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws ServletException, IOException { doGet(httpServletRequest, httpServletResponse); } protected void doGet(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws ServletException, IOException { try{ // 响应的Content-Type必须是text/xml httpServletResponse.setContentType("text/xml;charset=utf-8"); PrintWriter out = httpServletResponse.getWriter(); // 取参数 String old = httpServletRequest.getParameter("name"); // 返回的数据需要拼装成xml格式 StringBuilder builder = new StringBuilder(); builder.append("<message>"); //2.检查参数是否有问题 if(old == null || old.length() == 0){ builder.append("用户名不能为空").append("</message>"); } else{ //3.校验操作 String name = old; if(name.equals("hardwin")){ // 和传统应用不同之处。这一步需要将用户感兴趣的数据返回给页面段,而不是将一个新的页面发送给用户 builder.append("用户名[" + name + "]已经存在,请使用其他用户名").append("</message>"); } else{ builder.append("用户名[" + name + "]尚未存在,可以使用该用户名注册").append("</message>"); } out.println(builder.toString()); System.out.println(builder.toString()); } } catch(Exception e){ e.printStackTrace(); } } }