呵呵 虽说题目是在线聊天,不过因为时间的原因,所以部分代码没有完善,不过如果把如下代码看懂的话,我相信实现在线聊天对你来说将会轻而易举,一起来看看吧。
html代码:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%="http://" + request.getServerName() + ":"
+ request.getServerPort() + request.getRequestURI()%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="js/md5.js""></script>
<script type="text/javascript" src="js/util.js"></script>
<script type="text/javascript" src="js/talk.js"></script>
<title>Ajax</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<table border="1" align="center" cellpadding="4" cellspacing="0"
bordercolor="#000000" style="border-collapse: collapse">
<tr bgcolor="#f7f7f7">
<td colspan="3"> </td>
</tr>
<tr bgcolor="#f7f7f7">
<td>username:</td>
<td><input type="text" id="username" name="username" /></td>
<td><span id="usernameresut">请输入用户名。</span></td>
</tr>
<tr bgcolor="#f7f7f7">
<td>password:</td>
<td><input type="password" id="password" name="password">
</td>
<td> </td>
</tr>
<tr bgcolor="#f7f7f7" align="center">
<td colspan="3"><input type="submit" value="登录" id="submit">
</td>
</tr>
</table>
<div align="center">
<p>
<textarea rows="20" cols="50" id="info"></textarea>
</p>
<p>
输入内容:
<input type="text" id="lang" value="" size="33" />
<input type="button" value="发言"
id="talk"
style="font-family: 宋体; font-size: 9pt; color: #ffffff; background-color: #999900; border-width: 1pt; border-color: black; border-style: solid; CURSOR: hand">
</p>
</div>
</div>
</body>
</html>
JS代码
window.onload = iniPage;
// 初始化页面
function iniPage() {
document.getElementById("username").onblur = checkusername;
document.getElementById("submit").disabled = true;
document.getElementById("talk").onclick = submitInfo;
document.getElementById("talk").οnkeypress= submitInfo;
$("#info").readOnly = true;
username.focus();
username.select();
// 每隔1s执行一次函数
token = setInterval(add, 1000);
}
// 检验用户名是否存在
function checkusername() {
request = createRequest();
var username = document.getElementById("username");
var password = document.getElementById("password");
if (request == null) {
alert("error");
} else {
var url = "CheckUsername.action?username=" + escape(username.value)
+ "&password=" + hex_md5(escape(password.value));
request.onreadystatechange = callback;
request.open("GET", url, true);
request.send(null);
}
}
// 创建返回函数
function callback() {
if (request.readyState == 4) {
if (request.status == 200) {
document.getElementById("submit").disabled = false;
document.getElementById("usernameresut").innerHTML = request.responseText;
} else {
document.getElementById("submit").disabled = true;
}
}
}
// 仿在线聊天功能.......多线程异步执行
function add() {
// 重数据库读取消息向文本域中追加消息
// $("#info").append("admin:" + info + "\r");
// 设置文本域每次追加焦点在最下方
var scrollTop = $("#info")[0].scrollHeight;
$("#info").scrollTop(scrollTop);
// 取消计时刷新
// token.cleraInterval();
}
// 发消息并录入数据库
function submitInfo() {
// 向文本域中追加消息
info = document.getElementById("lang");
if ((info != null) && (info != "")) {
$("#info").append("admin:" + info.value + "\r");
// 设置文本域每次追加焦点在最下方
var scrollTop = $("#info")[0].scrollHeight;
$("#info").scrollTop(scrollTop);
info.value="";
}
}
Action代码
package com.action;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.dao.GetUserName;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class CheckUsernameAction extends ActionSupport {
private String username ;
private String password;
GetUserName geuusername ;
public String execute() throws Exception {
geuusername = new GetUserName();
ActionContext context = ActionContext.getContext();
Boolean result = geuusername.checkUserName(username);
HttpServletResponse response = ServletActionContext.getResponse() ;
response.setContentType("text/html;charset=UTF-8");
PrintWriter writer = response.getWriter();
if(result==true){
writer.write("用户名已存在!");
}else{
writer.write("恭喜,此名可用");
}
return null;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public GetUserName getGeuusername() {
return geuusername;
}
public void setGeuusername(GetUserName geuusername) {
this.geuusername = geuusername;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
这个简化点,大家参考参考吧。