简单的Ajax表单验证

来源：互联网发布：阿里旺旺淘宝网编辑：程序博客网时间：2024/05/17 02:30

新建JavaWeb项目，新建a.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 'a.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"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script type="text/javascript">var xmlHttp = false;try {xmlHttp = new ActiveObject("Msxml2.XMLHTTP");} catch (e) {try {xmlHttp = new ActiveObject("Microsoft.XMLHTTP");} catch (e) {xmlHttp = false;}}if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {xmlHttp = new XMLHttpRequest();}function callServer(){var city = document.getElementById("city").value;var url = "b.jsp?city="+city;xmlHttp.open("GET", url, true);xmlHttp.onreadystatechange = updatePage;xmlHttp.send(null);}function updatePage(){if(xmlHttp.readyState == 4){var response  = xmlHttp.responseText;document.getElementById("check").innerHTML = response;}}</script>  </head>    <body>城市：<input type="text" id="city" onblur="callServer();" />*<a style="color: red;" id="check"></a><br/>状态：<input type="text" id="state" onblur="" /><br/>  </body></html>

新建b.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String city = request.getParameter("city");System.out.println(city);if (city == null || city.trim().equals("")) {out.print("城市名不能为空！");} else {out.print("OK!");}%>

0 0