一、代码简介
本段代码主要实现了利用jquery的页面无刷新向后台验证用户名是否已注册,并返回值显示给用户。
二、图片预览
(1)刚进入页面时
(2)用户名可用时
(3)用户名不可用时(输入“红姬茄子”不可用)
(4)用户名为空时
(5)后台输出
三、示例代码
(1)struts.xml中代码段
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<package name="package" namespace="/" extends="struts-default">
<action name="Refresh" class="com.HJQZ.Refresh.Raction" method="refresh">
</action>
</package>
</struts>
(2)action中代码段
package com.HJQZ.Refresh;
import java.io.IOException;
import java.io.PrintWriter;
import java.io.UnsupportedEncodingException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class Raction extends ActionSupport {
public String refresh() {
int count = 0;
HttpServletRequest req = ServletActionContext.getRequest();
HttpServletResponse res = ServletActionContext.getResponse();
res.setContentType("text/html");
res.setCharacterEncoding("GBK");
PrintWriter out = null;
try {
out = res.getWriter();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
String rname = new String(req.getParameter("rname"));
try {
rname = java.net.URLDecoder.decode(rname,"utf-8");
} catch (UnsupportedEncodingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
System.out.println("Raction中===========rname+"+rname);
if(rname.equals("红姬茄子")){
count = 1;
}else{
count = 0;
}
if (count > 0) {
out.println(0);
}
else {
out.println(1);
}
return null;
}
}
(3)jsp页面代码段
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<script type="text/javascript" src="js/jquery-1.4.2.js">
</script>
<script type="text/javascript">
function checkRoler() {
var value = document.getElementById("rname").value.replace(/\s+/g, "");
value = encodeURI(value);
if (value == "") {
$("#lab").html("<font size=2 color='red'>用户名不能为空!</font");
return false;
}
$.post("Refresh", {
rname : value
}, function(data) {
if (data == 0) {
$("#lab").html("<font size=2 color=red>用户名被占用!</font>");
document.getElementById("rname").value = "";
} else {
$("#lab").html("<font size=2 color=green>可用</font>");
}
});
}
</script>
<body>
<form name="myform">
用户名:<input type="text" name="rname" id="rname" onblur="checkRoler()"/><font color="red">*</font>
<label id="lab">
</label>
<br><br>
</form>
</body>
四.总结
以上是本篇文章的全部内容,如有不足之处,还请各位大侠们多多指点,嘿嘿
附:另外记得要下载一个jquery-1.4.2.js文件,放在WebRoot目录下哦,亲,嘿嘿