Ajax初学体验(2)[检验用户名是否重复的完整实例]
发布时间:2020-12-16 00:41:55 所属栏目:百科 来源:网络整理
导读:1、创建index.jsp页面如下: %@ page language="java" import="java.util.*" pageEncoding="UTF-8"%%String path = request.getContextPath();String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ pa
1、创建index.jsp页面如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <script type="text/javascript" src="js/index.js"></script> </head> <body> <form action="CheckUserName" method="post"> 用户名:<input type="text" id="userName" onblur="checkUserName(this.value)" /> <lable id="result"></lable><br/> 密?码:<input type="password" name="password" /> </form> <br/> </body> </html>2、js文件如下: function createAjax(){ var ajax = null; try{ ajax = new XMLHttpRequest(); }catch(e1){ var versions=['Microsoft.XMLHTTP','MSXML.XMLHTTP','Msxml2.XMLHTTP.7.0','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.5.0','Msxml2.XMLHTTP.4.0','MSXML2.XMLHTTP.3.0','MSXML2.XMLHTTP']; for(var i = 0;i<versions.length;i++){ try{ ajax = new ActiveXObject(versions[i]); break; }catch(ex){ } } } return ajax; } function checkUserName(value){ var ajax = new createAjax(); ajax.open("GET","servlet/CheckUserName?userName="+value); ajax.onreadystatechange = function(){ if(ajax.readyState==4&&ajax.status==200){ document.getElementById("result").innerHTML = ajax.responseText; } } ajax.send(); } 3、逻辑处理的servlet package edu.uestc.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 CheckUserName extends HttpServlet { /** * Constructor of the object. */ public CheckUserName() { super(); } /** * Destruction of the servlet. <br> */ public void destroy() { super.destroy(); // Just puts "destroy" string in log // Put your code here } /** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException { //System.out.println("Do Get......"); String username = request.getParameter("userName"); //解决Get方法的乱码问题 username = new String(username.getBytes("ISO-8859-1"),"UTF-8"); System.out.println(username); response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); if ("zsz".equals(username)){ out.println("用户名重复"); }else{ out.println("用户名可用"); } out.flush(); out.close(); } /** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doPost(HttpServletRequest request,IOException { // Put your code here } /** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */ public void init() throws ServletException { // Put your code here } }配置文件如下: <servlet> <servlet-name>CheckUserName</servlet-name> <servlet-class>edu.uestc.servlet.CheckUserName</servlet-class> </servlet> <servlet-mapping> <servlet-name>CheckUserName</servlet-name> <url-pattern>/servlet/CheckUserName</url-pattern> </servlet-mapping> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |