简介
用户注册时，要求用户名不能相同，可以用Ajax异步校验的方式给出提示。效果：输入用户名，后面即给出提示信息。
实例
1、准备环境
新建一个web项目，配置Struts2环境。MysqL数据库新建一个user表，三个字段：id、username、password。
2、编写代码
- 新建实体类User，三个属性id、username、password，并给出它们的getter和setter方法，代码：略。
- 新建Action类UserAction，代码如下：
public class UserAction extends ActionSupport {
private User user;
public User getUser() {
return user;
}
public void setUser(User user) {
this.user = user;
}
// AJAX进行异步校验用户名的方法
public String findByName() throws Exception {
// 调用Service进行查询
Boolean existUser = findByUsername(user.getUsername());
// 获得response对象，向页面输出
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("text/html;charset=utf-8");
if (existUser) {
// 查询到该用户
response.getWriter().println("<font color='red'>用户名已经存在</font>");
} else {
// 没有查询到用户
response.getWriter().println("<font color='green'>用户名可以使用</font>");
}
return NONE;
}
public Boolean findByUsername(String username) throws Exception {
String url = "jdbc:MysqL://127.0.0.1:3306/dbname";
// 1、加载驱动程序
Class.forName("com.MysqL.jdbc.Driver");
// 2、与数据库建立连接
Connection conn = DriverManager.getConnection(url,"root","jujianfei");
// 创建Statement对象，用于执行sql语句
Statement sm = conn.createStatement();
// 3、执行一个sql Select语句，将其存入ResultSet中
ResultSet rs = sm.executeQuery("Select username,password from user where username ="+ username);
if (rs.next()) {
rs.close();
sm.close();
conn.close();
return true;
} else {
rs.close();
sm.close();
conn.close();
return false;
}
}
}
- struts.xml文件配置，代码如下：
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts-2.3.dtd">
<struts>
<constant name="struts.devMode" value="false" />
<package name="shop" extends="struts-default" namespace="/">
<!-- 配置用户模块的Action -->
<action name="user_*" class="cn.jujianfei.action.UserAction" method="{1}">
</action>
</package>
</struts>
- 新建jsp文件index.jsp，代码如下：
<head>
<base href="<%=basePath%>">
<title>ajax page</title>
<script> function checkUsername() { // 获得文件框值 var username = document.getElementById("username").value; // 1.创建异步交互对象 var xhr = createXmlHttp(); // 2.设置监听 xhr.onreadystatechange = function() { if (xhr.readyState == 4) { if (xhr.status == 200) { document.getElementById("tip").innerHTML = xhr.responseText; } } } // 3.打开连接 xhr.open("GET","${pageContext.request.contextpath}/user_findByName.action?time=" + new Date().getTime() + "&user.username=" + username,true); // 4.发送 xhr.send(null); } function createXmlHttp() { var xmlHttp; try { // Firefox,Opera 8.0+,Safari xmlHttp = new XMLHttpRequest(); } catch (e) { try {// Internet Explorer xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } return xmlHttp; } </script>
</head>
<body>
<form action="index.jsp" method="post">
用户名:<input type="text" id="username" name="username" onblur="checkUsername()"/><span id="tip"></span><br> 密 码:<input type="text" name="pwd" /><br>
<input type="submit" value="登录" />
</form>
</body>