展开全部
编写jsp页面（有些自动生成的代码我删掉了，不要直接复制。有用的代码只是JavaScript和form中的内容，并且此处不解释ajax的具体含义）：
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<%
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><s:text name="loginPage"></s:text> </title>
</head>
<script type="text/javascript">
var xmlHttp;
var result = false;
function checkuser(){
var uname = document.all.loginuser.value;
if(uname.length<3){//判断用户名的长度，如果不写或者太短则不能验证通过。
document.getElementById("unameMsg").innerHTML="<font color='red'>用户名太短，请重新输入！</font>";
return false;
}else{
document.all.unameMsg.innerHTML="<font color='red'>用户名检测中...</font>";
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE实例
}else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();//其他浏览器实例
}
var uri = "login!execute?user="+uname;//此处login为配置文件中的name，execute为action中的方法。
uri = encodeURI(uri);
uri = encodeURI(uri);
xmlHttp.open("post",uri,true);
xmlHttp.onreadystatechange = function(){//回调函数判断当前状态是否是响应状态
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
alert(xmlHttp.responseText)
if(xmlHttp.responseText=="true"){
document.all.unameMsg.innerHTML="<font color='red'>该用户名已被使用，请您重新选择用户名！</font>";
result = false;
}else{
document.all.unameMsg.innerHTML="<font color='red'>恭喜您，该用户名可用!</font>";
result = true ;
}
}
}
}
xmlHttp.send(null);
}
}
</script>
<body>
<s:form action="login">
<s:textfield name="loginuser" key="user" onblur="checkuser()"></s:textfield>通过失去焦点事件来调用函数进行验证
<s:div id="unameMsg">ccccc</s:div>
<s:password name="loginpass" key="pass"></s:password>
<s:submit value="登陆"></s:submit>
</s:form>
</body>
</html>
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<%
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><s:text name="loginPage"></s:text> </title>
</head>
<script type="text/javascript">
var xmlHttp;
var result = false;
function checkuser(){
var uname = document.all.loginuser.value;
if(uname.length<3){//判断用户名的长度，如果不写或者太短则不能验证通过。
document.getElementById("unameMsg").innerHTML="<font color='red'>用户名太短，请重新输入！</font>";
return false;
}else{
document.all.unameMsg.innerHTML="<font color='red'>用户名检测中...</font>";
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE实例
}else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();//其他浏览器实例
}
var uri = "login!execute?user="+uname;//此处login为配置文件中的name，execute为action中的方法。
uri = encodeURI(uri);
uri = encodeURI(uri);
xmlHttp.open("post",uri,true);
xmlHttp.onreadystatechange = function(){//回调函数判断当前状态是否是响应状态
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
alert(xmlHttp.responseText)
if(xmlHttp.responseText=="true"){
document.all.unameMsg.innerHTML="<font color='red'>该用户名已被使用，请您重新选择用户名！</font>";
result = false;
}else{
document.all.unameMsg.innerHTML="<font color='red'>恭喜您，该用户名可用!</font>";
result = true ;
}
}
}
}
xmlHttp.send(null);
}
}
</script>
<body>
<s:form action="login">
<s:textfield name="loginuser" key="user" onblur="checkuser()"></s:textfield>通过失去焦点事件来调用函数进行验证
<s:div id="unameMsg">ccccc</s:div>
<s:password name="loginpass" key="pass"></s:password>
<s:submit value="登陆"></s:submit>
</s:form>
</body>
</html>
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
