|
ajax用户验证(jsp)
index.html
<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage=""%>
<%
request.setCharacterEncoding("utf-8");
%>
<!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>无标题文档</title>
<script type="text/javascript" src="ajax.js">
</script>
</head>
<body>
AJAX:
<form action="greeting.jsp" method="get">
<p>
<input type="text" id="name" name="name" value="" onblur="startRequest()"/>
<span id="show1">*</span></p>
<p>
<input type="text" id="pwd" name="pwd" value="" onblur="spwd()"/>
<span id="pwdshow">*</span></p>
<p>
<input type="text" id="repwd" name="repwd" value="" onblur="srepwd()" />
<span id="repwdshow">*</span>
</p>
<p>
<input type="button" value="简单请求" onclick="startRequest()" />
<input type="submit" onclick="return checkform()" value="button" />
</p>
</form>
</body>
</html>
ajax.js
var xmlHttp;
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else {
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
}
function startRequest() {
createXMLHttpRequest();
show("show1", "<img src='img/loading.gif'/>"); //显示状态
xmlHttp.onreadystatechange = handleStateChange;
var name = document.getElementById("name").value; ///////////////////////////////
xmlHttp.open("GET", "greeting.jsp?name=" + name, true); //////////// get方法////////////
xmlHttp.send(null); ///////////////////////////////
//xmlHttp.open("POST","greeting.jsp",true); //////////////////////////////
//xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); ///////////post方法///////////
//xmlHttp.send("name="+name); //////////////////////////////
}
function handleStateChange() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
var responseText = xmlHttp.responseText;
show("show1", responseText); //调用show函数
}
}
}
function show(span, obj) { /////输出信息
var Show = document.getElementById(span);
Show.innerHTML = obj;
}
function checkform() {
if (document.getElementById("pwd").value == "") {
document.getElementById("pwd").focus();
show("pwdshow","密码不能为空");
//document.getElementById("pwdshow").innerHTML="密码不能为空";
return false;
}
if (document.getElementById("repwd").value == "") {
document.getElementById("repwd").focus();
show("repwdshow","请再次输入密码");
return false;
}
if (document.getElementById("pwd").value != document.getElementById("repwd").value) {
document.getElementById("repwd").focus();
show("repwdshow","两次密码不一致");
return false;
}
}
function spwd() {
if (document.getElementById("pwd").value == "") {
//document.getElementById("pwd").focus();
show("pwdshow","密码不能为空");
return false;
} else {
show("pwdshow", "OK!");
}
//return true;
}
function srepwd() {
spwd();
if (document.getElementById("repwd").value == "") {
//document.getElementById("repwd").focus();
show("repwdshow","请再次输入密码");
return false;
} else {
show("repwdshow", "OK!");
}
//return true;
if (document.getElementById("pwd").value != document.getElementById("repwd").value) {
//document.getElementById("repwd").focus();
show("repwdshow","两次密码不一致");
return false;
} else {
show("repwdshow", "OK!");
}
}
greeting.jsp
<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage=""%>
<!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>无标题文档</title>
</head>
<body>
<%
request.setCharacterEncoding("utf-8");
String name=request.getParameter("name");
if(name.equals("123")){
//name="chongfu";
out.print("chongfu");
}else{
//name=name+"!!!!!";
out.print("hello,"+name);
}
%>
</body>
</html> |
|