ajax无刷新来聊天代码
只发关键部分了啊
/*
*@ author 让痛苦痛苦
*@ param 开源QQ群：37424970
*@ param 本人邮箱:zhuseahui@yahoo.com.cn
*/
*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*--*
jsp页面代码：
<%@ page language="java" import="java.util.*,com.yeeyoo.it.*,java.text.*" pageEncoding="GB18030"%>
<jsp:directive.page import="com.yeeyoo.model.*"/>
<jsp:directive.page import="com.yeeyoo.Bo.*"/>
<%
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%>">
<%
ArrayList al=(ArrayList)new UsersBo().ShowAllUsersZaixian();
%>
<title>My JSP 'right_index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<style type="text/css">
<!--
.ziti {
font-family: "宋体";
font-size: 16px;
font-weight: bold;
color: #3300CC;
}
.ziti2 {
font-family: "宋体";
font-size: 12px;
color: #666666;
}
.ziti3
{
font-family: "宋体";
font-size: 12px;
color: blue;
}
-->
</style>
<style type="text/css">
.an
{
border-bottom-color:#000000; border-bottom-style:solid; border-bottom-width:1pt; border-left-color:
#000000;
border-left-style:solid; border-left-width:1pt;border-right-color:#000000; border-right-
style:solid; border-right-width:1pt;
border-top-color:#000000; border-top-style:solid; border-top-width:1pt;
cursor: hand;
}
.a
{
border-bottom-color:#666666; border-bottom-style:solid; border-bottom-width:1pt;
border-left-color: #666666; border-left-style:solid; border-left-width:1pt;
border-right-color:#666666; border-right-style:solid; border-right-width:1pt;
border-top-color:#666666; border-top-style:solid; border-top-width:1pt;
}
</style>
<script type="text/#">
window.setInterval("getal()",2000);
function aa()
{
var riqi=new Date();
var mm=parseInt(riqi.getMonth())+1;
//window.alert(mm);
var str=riqi.getYear()+"-"+mm+"-"+riqi.getDate()+" "+riqi.getHours()+":"+riqi.getMinutes
()+":"+riqi.getSeconds();
document.all.dd.value=str;
//window.alert(document.all.dd.value);
}
var req2;
function getal(){
if(window.ActiveXObject){
//ie
req2=new ActiveXObject("Microsoft.XMLHTTP");
}else{
req2=new XMLHttpReqeust();
}
if(req2){
//window.alert(document.all.dd.value);
var url="<%=basePath%>liaotian.do?path=alzaixian&d="+document.all.dd.value;
req2.open("get",url,"true");
req2.onreadystatechange=finish2;
//window.alert(url);
req2.send(url);
}
}
function finish2(){
if(req2.readyState==4){
if(req2.status==200){
//window.alert("fsdafsafsaf");
//取出信息sender
var geters=req2.responseXML.getElementsByTagName("z");
//window.alert(geters.length);
var aaa="";
for(var a=0;a<geters.length;a++)
{
aaa+=geters[a].firstChild.#+"/r/n";
//window.alert("ssss+++++++======="+aaa);
}
var cityArr=new Array();
for(var i=0;i<geters.length;i++){
cityArr[i]=geters[i].firstChild.#;
}
var as=document.all.a2.value;
var a2=document.getElementById("a2");
a2.length=0;
//a2.options[0]=new Option("大家","大家");
// window.alert(as);
for(var j=0;j<cityArr.length;j++){
a2.options[j]=new Option(cityArr[j],cityArr[j]);
if(cityArr[j]==as)
{
//window.alert(j);
//document.all.a2.selectindex=j;
// a2.options.selected="true";
a2.selectedIndex=j;
}
}
//填充到
if(aaa!="no"){
document.all.textarea3.innerText="在线好友:/r/n"+aaa;
}
var geters=req2.responseXML.getElementsByTagName("geter");
var geter=geters[0].firstChild.#;
var senders=req2.responseXML.getElementsByTagName("sender");
var sender=senders[0].firstChild.#;
var d=req2.responseXML.getElementsByTagName("d");
var dd=d[0].firstChild.#;
// var riqi=new Date();
// var mm=parseInt(riqi.getMonth())+1;
//window.alert(mm);
//var str=riqi.getYear()+"-"+mm+"-"+riqi.getDate()+" "+riqi.getHours()
+":"+riqi.getMinutes()+":"+riqi.getSeconds();
//var str1=str;
// var str2=dd;
// str11=new Date(str1.replace("-",",")).getTime() ;
// str22=new Date(str2.replace("-",",")).getTime() ;
//window.alert(str1);
var cons=req2.responseXML.getElementsByTagName("con");
var con=cons[0].firstChild.#;
//填充到
//if(str11>str22)
//{
// window.alert("sss");
var cc=document.all.textarea.innerText;
// zhuti=zhuti.substring(zhuti.lastIndexOf(""), zhuti.length());
cc=cc.substring(cc.lastIndexOf("/r/n")+2,cc.length);
//window.alert("cc==="+cc+"11con=="+con);
if(cc!=con){
if(con!="no"){
document.all.textarea.innerText=document.all.textarea.innerText+"/r/n"+sender
+" 对 "+ geter+" 说: "+dd+" /r/n"+con+"/r/n";
}
// }
}
}
}
}
var req;
function aa2()
{
if(window.event.keyCode==10)
{
if(document.all.textarea2.innerText=="")
{
window.alert("发送消息不能为空!");
document.all.textarea2.select();
return false;
}
if(window.ActiveXObject){
//ie
req=new ActiveXObject("Microsoft.XMLHTTP");
}else{
req=new XMLHttpReqeust();
}
if(req){
var url="<%=basePath%>liaotian.do?
path=send&con="+document.all.textarea2.innerText+"&geter="+document.all.a2.value;
//window.alert(url);
req.open("get",url,"true");
//指定函数
req.onreadystatechange=finish;
//真的发送
req.send(url);
document.all.textarea2.innerText="";
}
}
}
function send()
{
if(document.all.textarea2.innerText=="")
{
window.alert("发送消息不能为空!");
document.all.textarea2.select();
return false;
}
if(window.ActiveXObject){
//ie
req=new ActiveXObject("Microsoft.XMLHTTP");
}else{
req=new XMLHttpReqeust();
}
if(req){
var url="<%=basePath%>liaotian.do?
path=send&con="+document.all.textarea2.innerText+"&geter="+document.all.a2.value;
//window.alert(url);
req.open("get",url,"true");
//指定函数
req.onreadystatechange=finish;
//真的发送
req.send(url);
document.all.textarea2.innerText="";
}
}
//回调函数
function finish(){
if(req.readyState==4){
if(req.status==200){
//window.alert("fsdafsafsaf");
//取出信息sender
var geters=req.responseXML.getElementsByTagName("geter");
var geter=geters[0].firstChild.#;
var senders=req.responseXML.getElementsByTagName("sender");
var sender=senders[0].firstChild.#;
var d=req.responseXML.getElementsByTagName("d");
var dd=d[0].firstChild.#;
var cons=req.responseXML.getElementsByTagName("con");
var con=cons[0].firstChild.#;
//填充到页面中
if(con!="no"){
document.all.textarea.innerText=document.all.textarea.innerText+"/r/n"+sender
+" 对 "+ geter+" 说: "+dd+" /r/n"+con+"/r/n";
}
}
else
{
document.all.textarea.innerText="您刚才发送的消息失败!";
}
}
}
function dd()
{
document.all.textarea.innerText="";
}
function fuzhi()
{
if(clipboard#.set#('Text',document.getElementById('textarea').value))
{
window.alert("复制成功,该页面内容已经到您的剪贴板中...");
}
}
</script>
</head>
<body οnlοad="aa();" bgcolor="#666666" >
<table width="100%" height="100%" border="1" cellspacing="0" cellpadding="1" background="#CCCCCC" >
<tr><td>
<table width="100%" border="0">
<tr>
<td class="a" width="100">
<input type="hidden" name="dd" value="">
<textarea name="textarea3" id="textarea3" cols="15" rows="40" readonly="readonly"> //注释：左侧的动态好友在线显示
在线好友:
<%
if(al.size()>0)
{
for(int i=0;i<al.size();i++)
{
Users u=(Users)al.get(i);
out.println(u.getUName());
}
}
else
{
out.println("无好友在线");
}
%>
</textarea>
</td>
<td>
<form action="" name="a3" id="a3">
<table width="100%" border="0">
<tr>
<td><label>
<textarea name="textarea" cols="80" rows="35" id="textarea" readonly="readonly"></textarea>
</label>对
<select id="a2" name="a2"> //下拉框好友动态显示
<option value="大家">大家</option>
<%
if(al.size()>0)
{
for(int i=0;i<al.size();i++)
{
Users u=(Users)al.get(i);
out.println("<option value="+u.getUName()+">"+u.getUName()+"</option>");
}
}
else
{
out.println("无好友在线");
}
%>
</select>说:
<input type="button" value="清空" οnclick="dd();">
<input type="button" value="复制内容" οnclick="fuzhi();" />
</td>
</tr>
<tr>
<td><label>
<textarea name="textarea2" cols="50" rows="4" οnkeypress="aa2();"></textarea>
<span οnclick="return send();" class="an"><font size="7" color="pink"> 发送
</font></span></label>
<div style="font-size: 15" align="right">"Ctrl+回车"直接发送!</div>
</td>
</tr>
</table>
</form></td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>
*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*--*
Action代码 ，即逻辑代码
public ActionForward send(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
//LiaotianForm liaotianForm = (LiaotianForm) form;// TODO Auto-generated method stub
response.setCharacterEncoding("utf-8");
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out=null;
try {
out = response.getWriter();
} catch (IOException e) {
// TODO 自动生成 catch 块
e.printStackTrace();
}
String con=request.getParameter("con");
String geter=request.getParameter("geter");
String send=(String)request.getSession().getAttribute("u_name");
Date d=Calendar.getInstance().getTime();//获取当前时间
new LiaotianBO().addLiaotianCon(send,con,geter,d);//填充数据库
//生成XML格式
String mes="<mes>";
mes+="<sender>"+send+"</sender><geter>"+geter+"</geter><con>"+con+"</con><d>"+d+"</d>";
mes+="</mes>";
//System.out.println("mes=="+mes);
out.write(mes);
out.close();
return mapping.findForward("iii");
}
public ActionForward alzaixian(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
//LiaotianForm liaotianForm = (LiaotianForm) form;// TODO Auto-generated method stub
response.setCharacterEncoding("utf-8");
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out=null;
try {
out = response.getWriter();
} catch (IOException e) {
// TODO 自动生成 catch 块
e.printStackTrace();
}
String uname=(String)request.getSession().getAttribute("u_name");//提取缓存中的信息，该用户的用户名
信息
String d=request.getParameter("d");
ArrayList al=(ArrayList)new UsersBo().ShowAllUsersZaixian();//查询数据库
ArrayList all=(ArrayList)new LiaotianBO().ShowLiaotianDate(d,uname);//查询数据库
//生成XML格式信息
String al2="<al><z>大家</z>";
if(al.size()==0)
{
al2+="<z>no</z>";
}
for(int i=0;i<al.size();i++)
{
Users u=(Users)al.get(i);
al2+="<z>"+u.getUName()+"</z>";
}
if(all.size()==0)
{
al2+="<sender>no</sender><geter>no</geter><con>no</con><d>no</d>";
}
else{
//System.out.println("sssssssssss");
for(int j=0;j<all.size();j++)
{
//System.out.println("sssssssssssssssssssssssss");
Liaotian l=(Liaotian)all.get(j);
//System.out.println("sssssssssssssssssssssssss");
al2+="<sender>"+l.getLSend()+"</sender><geter>"+l.getLGet()+"</geter><con>"+l.getLCon()
+"</con><d>"+l.getLDate()+"</d>";
}
}
al2+="</al>";
//System.out.println(al2);
out.write(al2);
out.close();
return mapping.findForward("iii");
}
*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*--*
BO层：
*******************************************************************************************************************
*******
UsersBo():
package com.yeeyoo.Bo;
import java.util.ArrayList;
import java.util.Date;
import com.yeeyoo.model.Users;
public class UsersBo {
MyTools mt=new MyTools();
String hql="";
public ArrayList ShowAllUsersZaixian()
{
hql="from Users where u_zaixian=1 order by u_id desc";
return (ArrayList)mt.queray_all(hql);
}
}
------------------------------------------------------------------------------------------------------------------
--------------
LiaotianBo():
package com.yeeyoo.Bo;
import java.util.ArrayList;
import java.util.Date;
import com.yeeyoo.model.Liaotian;
public class LiaotianBO {
MyTools mt=new MyTools();
String hql="";
public boolean addLiaotianCon(String send, String con, String geter, Date d) {
// TODO 自动生成方法存根
Liaotian l=new Liaotian();
l.setLSend(send);
l.setLCon(con);
l.setLGet(geter);
l.setLDate(d);
return mt.add_all(l);
}
public ArrayList ShowLiaotianDate(String date, String uname)
{
hql="from Liaotian where l_date>'"+date+"' and (l_get='"+uname+"' or l_get='大家') order by l_id
desc";
//System.out.println(hql);
return (ArrayList)mt.queray_all(hql);
}
}
*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*--*
Model层：
*******************************************************************************************************************
**********
Users:
package com.yeeyoo.model;
import java.util.Date;
/**
* Users generated by MyEclipse - Hibernate Tools
*/
public class Users implements java.io.Serializable {
// Fields
private Integer UId;
private String UEmail;
private String UName;
private String UPwd;
private Byte USex;
private Date UBirthday;
private String UAddrSheng;
private String UAddrCity;
private String UImage;
private Integer UJifen;
private Integer UGrade;
private Integer UFangsaorao;
private Date UTime;
private Integer UFangwen;
private Byte UZaixian;
......
以下是set()和get()方法!
}
------------------------------------------------------------------------------------------------------------------
--------------
package com.yeeyoo.model;
import java.util.Date;
/**
* Liaotian generated by MyEclipse - Hibernate Tools
*/
public class Liaotian implements java.io.Serializable {
// Fields
private Integer LId;
private String LSend;
private String LCon;
private String LGet;
private Date LDate;
private Integer LGrade;
......
以下是set()和get()方法!
}
*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*--*
数据库脚本：
--用户表
--drop table users
create table users
(
u_id int identity primary key,
u_email varchar(100) unique,
u_name varchar(20) unique,
u_pwd varchar(35),
u_sex bit default 0,
u_birthday datetime,
u_addr_sheng varchar(20),
u_addr_city varchar(20),
u_image varchar(200),
u_jifen int default 5,--每次登陆一次加5分 每增加一个好友 1分 发表一篇日志 3分 添加一首音乐2分 相册 2分 获得留
言 1分
u_grade int default 0,
u_fangsaorao int default 0 , --0为无限制 1为防骚扰 2为不允许其他
u_time datetime default getdate()
)
--聊天内容表
drop table liaotian
create table liaotian
(
l_id int identity primary key,
l_send varchar(20),
l_con varchar(6000),
l_get varchar(20) default '大家',
l_date datetime default getdate(),
l_grade int ,
)
select * from liaotian
最后解说点：
ajax是目前比较流行的一门技术，它的无刷新可以为页面增加很多色彩，而且还能为网络中服务器与客户端直接的留恋能够解决了
不少问题，这样，很多企业和个人喜欢上了这门技术， 这个小小的聊天案例集成了ajax与JS直接的操作，供学习者使用！
155
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
