JSP+AJAX 聊天室代码

yacole

浏览: 241213 次
性别:
来自: 浙江科技学院

最近访客更多访客>>

ifso

zzwlstarby

heheda520

djyotm

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JSP+JAVA资料专区

Ajax JSP JavaScript CSS REST

tw-sack.js

js 代码

/* Simple AJAX Code-Kit (SACK) */
/* 2005 Gregory Wild-Smith */
/* [url]www.twilightuniverse.com[/url] */
/* Software licenced under a modified X11 licence, see documentation or authors website for more details */
function sack(file){
this.AjaxFailedAlert = "Your browser does not support the enhanced functionality of this website, and therefore you will have an experience that differs from the intended one.\n";
this.requestFile = file; // 提交的页面
this.method = "POST";
this.URLString = "";
this.encodeURIString = true;
this.execute = false;
this.onLoading = function() { };//读取中
this.onLoaded = function() { };//已经读取
this.onInteractive = function() { };//交互中
this.onCompletion = function() { }; // 信息返回之后执行的方法
this.complete = function(){};//处理完毕
this.createAJAX = function() {
try {
this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
try {
this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (err) {
this.xmlhttp = null;
}
}
if(!this.xmlhttp && typeof XMLHttpRequest != "undefined")
this.xmlhttp = new XMLHttpRequest();
if (!this.xmlhttp){
this.failed = true;
}
};
this.setVar = function(name, value){
if (this.URLString.length < 3){
this.URLString = name + "=" + value;
} else {
this.URLString += "&" + name + "=" + value;
}
}
this.encVar = function(name, value){
var varString = encodeURIComponent(name) + "=" + encodeURIComponent(value);
return varString;
}
this.encodeURLString = function(string){
varArray = string.split('&');
for (i = 0; i < varArray.length; i++){
urlVars = varArray[i].split('=');
if (urlVars[0].indexOf('amp;') != -1){
urlVars[0] = urlVars[0].substring(4);
}
varArray[i] = this.encVar(urlVars[0],urlVars[1]);
}
return varArray.join('&');
}
this.runResponse = function(){
eval(this.response);
}
this.runAJAX = function(urlstring){
this.responseStatus = new Array(2);
if(this.failed && this.AjaxFailedAlert){
alert(this.AjaxFailedAlert);
} else {
if (urlstring){
if (this.URLString.length){
this.URLString = this.URLString + "&" + urlstring;
} else {
this.URLString = urlstring;
}
}
if (this.encodeURIString){
var timeval = new Date().getTime();
this.URLString = this.encodeURLString(this.URLString);
this.setVar("rndval", timeval);
}
if (this.element) { this.elementObj = document.getElementById(this.element); }
if (this.xmlhttp) {
var self = this;
if (this.method == "GET") {
var totalurlstring = this.requestFile + "?" + this.URLString;
this.xmlhttp.open(this.method, totalurlstring, true);
} else {
this.xmlhttp.open(this.method, this.requestFile, true);
}
if (this.method == "POST"){
try {
this.xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8')
} catch (e) {}
}
this.xmlhttp.send(this.URLString);
this.xmlhttp.onreadystatechange = function() {
switch (self.xmlhttp.readyState){
case 1: //读取中
self.onLoading();
break;
case 2: //已经读取
self.onLoaded();
break;
case 3: //交互中
self.onInteractive();
break;
case 4: //处理完毕
self.response = self.xmlhttp.responseText;
self.responseXML = self.xmlhttp.responseXML;
self.responseStatus[0] = self.xmlhttp.status;
self.responseStatus[1] = self.xmlhttp.statusText;
self.onCompletion();
if(self.execute){ self.runResponse(); }
if (self.elementObj) {
var elemNodeName = self.elementObj.nodeName;
elemNodeName.toLowerCase();
if (elemNodeName == "input" || elemNodeName == "select" || elemNodeName == "option" || elemNodeName == "textarea"){
self.elementObj.value = self.response;
} else {
self.elementObj.innerHTML = self.response;
}
}
self.URLString = "";
self.complete();
break;
}
};
}
}
};
this.createAJAX();
}

display.js

js 代码

function overInput(a){
getId("btn").style.border = "1px solid #54ce43"
getId("content").style.border = "1px solid #54ce43"
focs()
}
function outInput(a){
getId("btn").style.border = "1px solid #AAA"
getId("content").style.border = "1px solid #AAA"
focs()
}
function overBtn(a){
a.src = "images/hover.gif"
}
function outBtn(a){
a.src = "images/rest.gif"
}
function lrover(a){
a.style.backgroundColor = "#EEE"
}
function lrout(a){
a.style.backgroundColor = "#FFF"
}
function focs(){
getName("content").focus();
}
function clean(){
getName("content").value = ""
}
var chats = new Array()
var chatStart
function addChat(strChat){
if(chats.length > 199){
chats.shift()
}
chats.push(strChat)
chatStart = chats.length
}
function preChat(){
if(chatStart && chatStart >= 1){
if(chatStart == 1){
getName("content").value = chats[0]
chatStart = 0.5
}else{
chatStart -= 1
getName("content").value = chats[chatStart]
}
}
getId("loadifo").innerHTML = chatStart+","+chats.length
}
function nextChat(){
if(chatStart && chatStart < chats.length && chats.length > 1){
if(chatStart == 0.5){
chatStart = 1
}else if(chatStart == chats.length - 1){
chatStart = chats.length - 1
}else{
chatStart += 1
}
getName("content").value = chats[chatStart]
}
getId("loadifo").innerHTML = chatStart+","+chats.length
}
window.onload = function(){
getId("outs").onmousedown = function(){
overs = 1
}
getId("outs").onmouseout = function(){
overs = 0
focs()
}
getName("content").onkeydown = function(e){
if(document.all){
var Keys = event.keyCode;
}else{
var Keys = e.which;
}
//alert(Keys)
if(Keys == "38"){
preChat()
}else if(Keys == "40"){
nextChat()
}else if(event.ctrlKey && Keys == "13"){
doUsingPost()
}else if(event.ctrlKey && Keys == "46"){
clean()
}
}
}
function getId(objId){
return document.getElementById(objId)
}
function getName(objName){
return document.getElementsByName(objName)[0]
}

chat.js

js 代码

var overs;
var clien = 0;
function doUsingGet(){
var ajax=new sack("chat.jsp");
ajax.setVar("clien",clien);
ajax.setVar("timeStamp",new Date().getTime());
ajax.method='GET';
ajax.onLoading=function(){
document.getElementById("zt").innerHTML="读取中......";
}
ajax.onCompletion=function(){// 信息返回之后执行的方法
CheckState(ajax.responseXML.documentElement);
}
ajax.onLoaded=function(){
document.getElementById("zt").innerHTML="已经读取......";
}
ajax.onInteractive=function(){
document.getElementById("zt").innerHTML="交互中......";
}
ajax.complete = function(){
document.getElementById("zt").innerHTML="处理完毕......";
}
ajax.runAJAX();
}
function doUsingPost(){
if(getName("content").value!=""){
var named = getName("named").value;
var content = getName("content").value;
var ajax=new sack("chat.jsp");
ajax.setVar("clien",clien);
ajax.setVar("content",content);
ajax.setVar("named",named);
ajax.setVar("timeStamp",new Date().getTime());
ajax.method='POST';
ajax.onLoading=function(){
document.getElementById("zt").innerHTML="读取中......";
}
ajax.onCompletion=function(){// 信息返回之后执行的方法
CheckState(ajax.responseXML.documentElement);
}
ajax.onLoaded=function(){
document.getElementById("zt").innerHTML="已经读取......";
}
ajax.onInteractive=function(){
document.getElementById("zt").innerHTML="交互中......";
}
ajax.complete = function(){
document.getElementById("zt").innerHTML="处理完毕......";
}
ajax.runAJAX();
focs();
clean();
}else{
alert("请输入对话内容！")
focs()
}
}
function CheckState(res){
var resLen = res.getElementsByTagName("items").length
if(getTag(res,0,"num") != clien){
clien = getTag(res,0,"num")
for(var i=0; i<resLen; i++){
var useName = getTag(res,i,"name")
var useMag = getTag(res,i,"conts")
var useIp = getTag(res,i,"ip")
if(clien != "0" && useMag != ""){
if(useName != ""){
var lis = "用户"+ useName + "说：" + useMag //+ " ["+ useIp + "]"
}else{
var lis = "用户 ["+ useIp + "] 说：" + useMag
}
}else{
var lis = ""
}
getId("chatmain").innerHTML += lis + " "
}
innerSize()
}
}
function innerSize(){
if(overs != 1){
if(getId("chatmain").offsetHeight < getId("outmain").offsetHeight){
getId("chatmain").style.marginTop = getId("outmain").offsetHeight - getId("chatmain").offsetHeight +"px";
}else{
getId("chatmain").scrollIntoView(false)
}
}
}
function getTag(response,i,objTagName){
try{
var nodeV = response.getElementsByTagName(objTagName)[i].firstChild.nodeValue;
}catch(e){
var nodeV = ""
}
return nodeV;
}
setInterval("doUsingGet()",1000)

chat.jsp

jsp代码

<%@ page contentType="text/xml; charset=gb2312" %>
<%!
String func(String content){
return content.replaceAll("<","＜").replaceAll(">","＞");
}
%>
<%
String ip=request.getRemoteAddr(); //客户端IP
int clien = new Integer(request.getParameter("clien")).intValue(); //当前是第几个用户如果为0就是新来的用户
if(application.getAttribute("counts")==null){
application.setAttribute("counts",new Integer(0));
}
int counts = new Integer(application.getAttribute("counts").toString()).intValue(); //当前用户的ID
if(request.getParameter("content")!=null){
synchronized(this){
if(counts < 21){
int i = counts + 1;
application.setAttribute("counts",new Integer(i));
}else if(counts >= 21){
application.setAttribute("counts","1");
}
counts = new Integer(application.getAttribute("counts").toString()).intValue(); //当前用户的ID
int Cnum = counts;
String names;
String Msgs = request.getParameter("content");
// Msgs=new String(Msgs.getBytes("iso8859-1"),"gb2312");
application.setAttribute("ips" + Cnum,ip) ;
application.setAttribute("msgs" + Cnum,func(Msgs)) ;
if(request.getParameterValues("content") != null){
names = request.getParameter("named");
}else{
names = "";
}
application.setAttribute("names" + Cnum,names +"") ;
}
}
%><?xml version="1.0" encoding="gb2312" ?>
<ppl>
<num><%=application.getAttribute("counts")%></num>
<%
if(clien == 0){
%>
<items>
<ip><%=ip%></ip>
</items>
<%
}else if(clien < counts){
for(int i=clien; i<counts; i++){
int s = i+1;
String useName = (String)application.getAttribute("names" + s);
String useMsg = (String)application.getAttribute("msgs" + s);
String useIp = (String)application.getAttribute("ips" + s);
%>
<items>
<aaa><%=clien%> <%=s%></aaa>
<bbb><%=counts%></bbb>
<name><%=useName%></name>
<conts><%=useMsg%></conts>
<ip><%=useIp%></ip>
</items>
<%
}
}else if(clien > counts){
for(int i=clien; i<21; i++){
String useName = (String)application.getAttribute("names" + i);
String useMsg = (String)application.getAttribute("msgs" + i);
String useIp = (String)application.getAttribute("ips" + i);
%>
<items>
<name><%=useName%></name>
<conts><%=useMsg%></conts>
<ip><%=useIp%></ip>
</items>
<%
}
for(int m=1; m<=counts; m++){
String useNameM = (String)application.getAttribute("names" + m);
String useMsgM = (String)application.getAttribute("msgs" + m);
String useIpM = (String)application.getAttribute("ips" + m);
%>
<items>
<name><%=useNameM%></name>
<conts><%=useMsgM%></conts>
<ip><%=useIpM%></ip>
</items>
<%
}
}else if(clien == counts){
}
%>
</ppl>

index.html

html 代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<link href="images/chatstyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/display.js"></script>
<script type="text/javascript" src="js/chat.js"></script>
<script type="text/javascript" src="js/tw-sack.js"></script>
</head>
<body>
<div id="zt"></div>
<div id="loadifo"></div>
<div id="outs"><div id="outmain"><div id="chatmain"></div></div></div>
<div class="in">昵称：

分享到：

JSP+TOMCAT经典配置 | JSP使用Application 对象

2007-01-03 11:06
浏览 5396
评论(2)
查看更多

2 楼浅浅陌上桑 2016-04-14

为什么最后一个是不完整的

1 楼 lijianbin 2007-07-16

tw-sack.js 
<div class="code_title">js 代码</div>
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c">
 <li class="alt">/* Simple AJAX Code-Kit (SACK) */  </li>
 <li class="">/* 2005 Gregory Wild-Smith */  </li>
 <li class="alt">/* www.twilightuniverse.com */  </li>
 <li class="">/* Software licenced under a modified X11 licence, see documentation or authors website for more details */  </li>
 <li class="alt">  </li>
 <li class="">function sack(file){   </li>
 <li class="alt">this.AjaxFailedAlert = "Your browser does not support the enhanced functionality of this website, and therefore you will have an experience that differs from the intended one.\n";   </li>
 <li class="">this.requestFile = file; // 提交的页面   </li>
 <li class="alt">this.method = "POST";   </li>
 <li class="">this.URLString = "";   </li>
 <li class="alt">this.encodeURIString = true;   </li>
 <li class="">this.execute = false;   </li>
 <li class="alt">  </li>
 <li class="">this.onLoading = function() { };//读取中   </li>
 <li class="alt">this.onLoaded = function() { };//已经读取   </li>
 <li class="">this.onInteractive = function() { };//交互中   </li>
 <li class="alt">this.onCompletion = function() { }; // 信息返回之后执行的方法   </li>
 <li class="">this.complete = function(){};//处理完毕   </li>
 <li class="alt">this.createAJAX = function() {   </li>
 <li class="">try {   </li>
 <li class="alt">this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");   </li>
 <li class="">} catch (e) {   </li>
 <li class="alt">try {   </li>
 <li class="">this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");   </li>
 <li class="alt">} catch (err) {   </li>
 <li class="">this.xmlhttp = null;   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">if(!this.xmlhttp && typeof XMLHttpRequest != "undefined")   </li>
 <li class="">this.xmlhttp = new XMLHttpRequest();   </li>
 <li class="alt">if (!this.xmlhttp){   </li>
 <li class="">this.failed = true;   </li>
 <li class="alt">}   </li>
 <li class="">};   </li>
 <li class="alt">  </li>
 <li class="">this.setVar = function(name, value){   </li>
 <li class="alt">if (this.URLString.length < 3){   </li>
 <li class="">this.URLString = name + "=" + value;   </li>
 <li class="alt">} else {   </li>
 <li class="">this.URLString += "&" + name + "=" + value;   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">  </li>
 <li class="">this.encVar = function(name, value){   </li>
 <li class="alt">var varString = encodeURIComponent(name) + "=" + encodeURIComponent(value);   </li>
 <li class="">return varString;   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">this.encodeURLString = function(string){   </li>
 <li class="">varArray = string.split('&');   </li>
 <li class="alt">for (i = 0; i < varArray.length; i++){   </li>
 <li class="">urlVars = varArray[i].split('=');   </li>
 <li class="alt">if (urlVars[0].indexOf('amp;') != -1){   </li>
 <li class="">urlVars[0] = urlVars[0].substring(4);   </li>
 <li class="alt">}   </li>
 <li class="">varArray[i] = this.encVar(urlVars[0],urlVars[1]);   </li>
 <li class="alt">}   </li>
 <li class="">return varArray.join('&');   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">this.runResponse = function(){   </li>
 <li class="">eval(this.response);   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">this.runAJAX = function(urlstring){   </li>
 <li class="">this.responseStatus = new Array(2);   </li>
 <li class="alt">if(this.failed && this.AjaxFailedAlert){   </li>
 <li class="">alert(this.AjaxFailedAlert);   </li>
 <li class="alt">} else {   </li>
 <li class="">if (urlstring){   </li>
 <li class="alt">if (this.URLString.length){   </li>
 <li class="">this.URLString = this.URLString + "&" + urlstring;   </li>
 <li class="alt">} else {   </li>
 <li class="">this.URLString = urlstring;   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">if (this.encodeURIString){   </li>
 <li class="">var timeval = new Date().getTime();   </li>
 <li class="alt">this.URLString = this.encodeURLString(this.URLString);   </li>
 <li class="">this.setVar("rndval", timeval);   </li>
 <li class="alt">}   </li>
 <li class="">if (this.element) { this.elementObj = document.getElementById(this.element); }   </li>
 <li class="alt">if (this.xmlhttp) {   </li>
 <li class="">var self = this;   </li>
 <li class="alt">if (this.method == "GET") {   </li>
 <li class="">var totalurlstring = this.requestFile + "?" + this.URLString;   </li>
 <li class="alt">this.xmlhttp.open(this.method, totalurlstring, true);   </li>
 <li class="">} else {   </li>
 <li class="alt">this.xmlhttp.open(this.method, this.requestFile, true);   </li>
 <li class="">}   </li>
 <li class="alt">if (this.method == "POST"){   </li>
 <li class="">try {   </li>
 <li class="alt">this.xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8')   </li>
 <li class="">} catch (e) {}   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">this.xmlhttp.send(this.URLString);   </li>
 <li class="">this.xmlhttp.onreadystatechange = function() {   </li>
 <li class="alt">switch (self.xmlhttp.readyState){   </li>
 <li class="">case 1: //读取中   </li>
 <li class="alt">self.onLoading();   </li>
 <li class="">break;   </li>
 <li class="alt">case 2: //已经读取   </li>
 <li class="">self.onLoaded();   </li>
 <li class="alt">break;   </li>
 <li class="">case 3: //交互中   </li>
 <li class="alt">self.onInteractive();   </li>
 <li class="">break;   </li>
 <li class="alt">case 4: //处理完毕   </li>
 <li class="">self.response = self.xmlhttp.responseText;   </li>
 <li class="alt">self.responseXML = self.xmlhttp.responseXML;   </li>
 <li class="">self.responseStatus[0] = self.xmlhttp.status;   </li>
 <li class="alt">self.responseStatus[1] = self.xmlhttp.statusText;   </li>
 <li class="">self.onCompletion();   </li>
 <li class="alt">if(self.execute){ self.runResponse(); }   </li>
 <li class="">if (self.elementObj) {   </li>
 <li class="alt">var elemNodeName = self.elementObj.nodeName;   </li>
 <li class="">elemNodeName.toLowerCase();   </li>
 <li class="alt">if (elemNodeName == "input" || elemNodeName == "select" || elemNodeName == "option" || elemNodeName == "textarea"){   </li>
 <li class="">self.elementObj.value = self.response;   </li>
 <li class="alt">} else {   </li>
 <li class="">self.elementObj.innerHTML = self.response;   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">self.URLString = "";   </li>
 <li class="">self.complete();   </li>
 <li class="alt">break;   </li>
 <li class="">}   </li>
 <li class="alt">};   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">};   </li>
 <li class="alt">this.createAJAX();   </li>
 <li class="">}   </li>
</ol>
</div>
 
display.js 
<div class="code_title">js 代码</div>
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c">
 <li class="alt">function overInput(a){   </li>
 <li class="">getId("btn").style.border = "1px solid #54ce43"  </li>
 <li class="alt">getId("content").style.border = "1px solid #54ce43"  </li>
 <li class="">focs()   </li>
 <li class="alt">}   </li>
 <li class="">function outInput(a){   </li>
 <li class="alt">getId("btn").style.border = "1px solid #AAA"  </li>
 <li class="">getId("content").style.border = "1px solid #AAA"  </li>
 <li class="alt">focs()   </li>
 <li class="">}   </li>
 <li class="alt">function overBtn(a){   </li>
 <li class="">a.src = "images/hover.gif"  </li>
 <li class="alt">}   </li>
 <li class="">function outBtn(a){   </li>
 <li class="alt">a.src = "images/rest.gif"  </li>
 <li class="">}   </li>
 <li class="alt">function lrover(a){   </li>
 <li class="">a.style.backgroundColor = "#EEE"  </li>
 <li class="alt">}   </li>
 <li class="">function lrout(a){   </li>
 <li class="alt">a.style.backgroundColor = "#FFF"  </li>
 <li class="">}   </li>
 <li class="alt">function focs(){   </li>
 <li class="">getName("content").focus();   </li>
 <li class="alt">}   </li>
 <li class="">function clean(){   </li>
 <li class="alt">getName("content").value = ""  </li>
 <li class="">}   </li>
 <li class="alt">var chats = new Array()   </li>
 <li class="">var chatStart   </li>
 <li class="alt">function addChat(strChat){   </li>
 <li class="">if(chats.length > 199){   </li>
 <li class="alt">chats.shift()   </li>
 <li class="">}   </li>
 <li class="alt">chats.push(strChat)   </li>
 <li class="">chatStart = chats.length   </li>
 <li class="alt">}   </li>
 <li class="">function preChat(){   </li>
 <li class="alt">if(chatStart && chatStart >= 1){   </li>
 <li class="">if(chatStart == 1){   </li>
 <li class="alt">getName("content").value = chats[0]   </li>
 <li class="">chatStart = 0.5   </li>
 <li class="alt">}else{   </li>
 <li class="">chatStart -= 1   </li>
 <li class="alt">getName("content").value = chats[chatStart]   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">getId("loadifo").innerHTML = chatStart+","+chats.length   </li>
 <li class="alt">}   </li>
 <li class="">function nextChat(){   </li>
 <li class="alt">if(chatStart && chatStart < chats.length && chats.length > 1){   </li>
 <li class="">if(chatStart == 0.5){   </li>
 <li class="alt">chatStart = 1   </li>
 <li class="">}else if(chatStart == chats.length - 1){   </li>
 <li class="alt">chatStart = chats.length - 1   </li>
 <li class="">}else{   </li>
 <li class="alt">chatStart += 1   </li>
 <li class="">}   </li>
 <li class="alt">getName("content").value = chats[chatStart]   </li>
 <li class="">}   </li>
 <li class="alt">getId("loadifo").innerHTML = chatStart+","+chats.length   </li>
 <li class="">}   </li>
 <li class="alt">window.onload = function(){   </li>
 <li class="">getId("outs").onmousedown = function(){   </li>
 <li class="alt">overs = 1   </li>
 <li class="">}   </li>
 <li class="alt">getId("outs").onmouseout = function(){   </li>
 <li class="">overs = 0   </li>
 <li class="alt">focs()   </li>
 <li class="">}   </li>
 <li class="alt">getName("content").onkeydown = function(e){   </li>
 <li class="">if(document.all){   </li>
 <li class="alt">var Keys = event.keyCode;   </li>
 <li class="">}else{   </li>
 <li class="alt">var Keys = e.which;   </li>
 <li class="">}   </li>
 <li class="alt">//alert(Keys)   </li>
 <li class="">if(Keys == "38"){   </li>
 <li class="alt">preChat()   </li>
 <li class="">}else if(Keys == "40"){   </li>
 <li class="alt">nextChat()   </li>
 <li class="">}else if(event.ctrlKey && Keys == "13"){   </li>
 <li class="alt">doUsingPost()   </li>
 <li class="">}else if(event.ctrlKey && Keys == "46"){   </li>
 <li class="alt">clean()   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">}   </li>
 <li class="">function getId(objId){   </li>
 <li class="alt">return document.getElementById(objId)   </li>
 <li class="">}   </li>
 <li class="alt">function getName(objName){   </li>
 <li class="">return document.getElementsByName(objName)[0]   </li>
 <li class="alt">}   </li>
</ol>
</div>
 
chat.js 
<div class="code_title">js 代码</div>
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c">
 <li class="alt">var overs;   </li>
 <li class="">var clien = 0;   </li>
 <li class="alt">function doUsingGet(){   </li>
 <li class="">var ajax=new sack("chat.jsp");   </li>
 <li class="alt">ajax.setVar("clien",clien);   </li>
 <li class="">ajax.setVar("timeStamp",new Date().getTime());   </li>
 <li class="alt">ajax.method='GET';   </li>
 <li class="">ajax.onLoading=function(){   </li>
 <li class="alt">document.getElementById("zt").innerHTML="读取中......";   </li>
 <li class="">}   </li>
 <li class="alt">ajax.onCompletion=function(){// 信息返回之后执行的方法   </li>
 <li class="">CheckState(ajax.responseXML.documentElement);   </li>
 <li class="alt">}   </li>
 <li class="">ajax.onLoaded=function(){   </li>
 <li class="alt">document.getElementById("zt").innerHTML="已经读取......";   </li>
 <li class="">}   </li>
 <li class="alt">ajax.onInteractive=function(){   </li>
 <li class="">document.getElementById("zt").innerHTML="交互中......";   </li>
 <li class="alt">}   </li>
 <li class="">ajax.complete = function(){   </li>
 <li class="alt">document.getElementById("zt").innerHTML="处理完毕......";   </li>
 <li class="">}   </li>
 <li class="alt">ajax.runAJAX();   </li>
 <li class="">}   </li>
 <li class="alt">function doUsingPost(){   </li>
 <li class="">if(getName("content").value!=""){   </li>
 <li class="alt">var named = getName("named").value;   </li>
 <li class="">var content = getName("content").value;   </li>
 <li class="alt">var ajax=new sack("chat.jsp");   </li>
 <li class="">ajax.setVar("clien",clien);   </li>
 <li class="alt">ajax.setVar("content",content);   </li>
 <li class="">ajax.setVar("named",named);   </li>
 <li class="alt">ajax.setVar("timeStamp",new Date().getTime());   </li>
 <li class="">ajax.method='POST';   </li>
 <li class="alt">ajax.onLoading=function(){   </li>
 <li class="">document.getElementById("zt").innerHTML="读取中......";   </li>
 <li class="alt">}   </li>
 <li class="">ajax.onCompletion=function(){// 信息返回之后执行的方法   </li>
 <li class="alt">CheckState(ajax.responseXML.documentElement);   </li>
 <li class="">}   </li>
 <li class="alt">ajax.onLoaded=function(){   </li>
 <li class="">document.getElementById("zt").innerHTML="已经读取......";   </li>
 <li class="alt">}   </li>
 <li class="">ajax.onInteractive=function(){   </li>
 <li class="alt">document.getElementById("zt").innerHTML="交互中......";   </li>
 <li class="">}   </li>
 <li class="alt">ajax.complete = function(){   </li>
 <li class="">document.getElementById("zt").innerHTML="处理完毕......";   </li>
 <li class="alt">}   </li>
 <li class="">ajax.runAJAX();   </li>
 <li class="alt">focs();   </li>
 <li class="">clean();   </li>
 <li class="alt">}else{   </li>
 <li class="">alert("请输入对话内容！")   </li>
 <li class="alt">focs()   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">  </li>
 <li class="">function CheckState(res){   </li>
 <li class="alt">var resLen = res.getElementsByTagName("items").length   </li>
 <li class="">if(getTag(res,0,"num") != clien){   </li>
 <li class="alt">clien = getTag(res,0,"num")   </li>
 <li class="">for(var i=0; i<resLen; i++){   </li>
 <li class="alt">var useName = getTag(res,i,"name")   </li>
 <li class="">var useMag = getTag(res,i,"conts")   </li>
 <li class="alt">var useIp = getTag(res,i,"ip")   </li>
 <li class="">if(clien != "0" && useMag != ""){   </li>
 <li class="alt">if(useName != ""){   </li>
 <li class="">var lis = "用户"+ useName + "说：" + useMag //+ " ["+ useIp + "]"   </li>
 <li class="alt">}else{   </li>
 <li class="">var lis = "用户 ["+ useIp + "] 说：" + useMag   </li>
 <li class="alt">}   </li>
 <li class="">}else{   </li>
 <li class="alt">var lis = ""  </li>
 <li class="">}   </li>
 <li class="alt">getId("chatmain").innerHTML += lis + "<br />"  </li>
 <li class="">}   </li>
 <li class="alt">innerSize()   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">  </li>
 <li class="alt">function innerSize(){   </li>
 <li class="">if(overs != 1){   </li>
 <li class="alt">if(getId("chatmain").offsetHeight < getId("outmain").offsetHeight){   </li>
 <li class="">getId("chatmain").style.marginTop = getId("outmain").offsetHeight - getId("chatmain").offsetHeight +"px";   </li>
 <li class="alt">}else{   </li>
 <li class="">getId("chatmain").scrollIntoView(false)   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">}   </li>
 <li class="">function getTag(response,i,objTagName){   </li>
 <li class="alt">try{   </li>
 <li class="">var nodeV = response.getElementsByTagName(objTagName)[i].firstChild.nodeValue;   </li>
 <li class="alt">}catch(e){   </li>
 <li class="">var nodeV = ""  </li>
 <li class="alt">}   </li>
 <li class="">return nodeV;   </li>
 <li class="alt">}   </li>
 <li class="">setInterval("doUsingGet()",1000)  </li>
</ol>
</div>
 
 
chat.jsp 
<div class="code_title">jsp代码</div>
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-xml">
 <li class="alt"><%@ page contentType="text/xml; charset=gb2312" %>  </li>
 <li class=""><%!   </li>
 <li class="alt">String func(String content){   </li>
 <li class="">return content.replaceAll("<","＜").replaceAll(">","＞");   </li>
 <li class="alt">}   </li>
 <li class="">%>  </li>
 <li class="alt"><%   </li>
 <li class="">String ip=request.getRemoteAddr(); //客户端IP   </li>
 <li class="alt">int clien = new Integer(request.getParameter("clien")).intValue(); //当前是第几个用户 如果为0就是新来的用户   </li>
 <li class="">if(application.getAttribute("counts")==null){   </li>
 <li class="alt">application.setAttribute("counts",new Integer(0));   </li>
 <li class="">}   </li>
 <li class="alt">int counts = new Integer(application.getAttribute("counts").toString()).intValue(); //当前用户的ID   </li>
 <li class="">if(request.getParameter("content")!=null){   </li>
 <li class="alt">synchronized(this){   </li>
 <li class="">if(counts < 21){   </li>
 <li class="alt">int i = counts + 1;   </li>
 <li class="">application.setAttribute("counts",new Integer(i));   </li>
 <li class="alt">}else if(counts >= 21){   </li>
 <li class="">application.setAttribute("counts","1");   </li>
 <li class="alt">}   </li>
 <li class="">counts = new Integer(application.getAttribute("counts").toString()).intValue(); //当前用户的ID   </li>
 <li class="alt">int Cnum = counts;   </li>
 <li class="">String names;   </li>
 <li class="alt">String Msgs = request.getParameter("content");   </li>
 <li class="">// Msgs=new String(Msgs.getBytes("iso8859-1"),"gb2312");   </li>
 <li class="alt">application.setAttribute("ips" + Cnum,ip) ;   </li>
 <li class="">application.setAttribute("msgs" + Cnum,func(Msgs)) ;   </li>
 <li class="alt">if(request.getParameterValues("content") != null){   </li>
 <li class="">names = request.getParameter("named");   </li>
 <li class="alt">}else{   </li>
 <li class="">names = "";   </li>
 <li class="alt">}   </li>
 <li class="">application.setAttribute("names" + Cnum,names +"") ;   </li>
 <li class="alt">}   </li>
 <li class="">}   </li>
 <li class="alt">%><?xml version="1.0" encoding="gb2312" ?>  </li>
 <li class=""><ppl>  </li>
 <li class="alt"><num><%=application.getAttribute("counts")%></num>  </li>
 <li class=""><%   </li>
 <li class="alt">if(clien == 0){   </li>
 <li class="">%>  </li>
 <li class="alt"><items>  </li>
 <li class=""><ip><%=ip%></ip>  </li>
 <li class="alt"></items>  </li>
 <li class=""><%   </li>
 <li class="alt">}else if(clien < counts){   </li>
 <li class="">for(int i=clien; i<counts; i++){   </li>
 <li class="alt">int s = i+1;   </li>
 <li class="">String useName = (String)application.getAttribute("names" + s);   </li>
 <li class="alt">String useMsg = (String)application.getAttribute("msgs" + s);   </li>
 <li class="">String useIp = (String)application.getAttribute("ips" + s);   </li>
 <li class="alt">%>  </li>
 <li class=""><items>  </li>
 <li class="alt"><aaa><%=clien%> <%=s%></aaa>  </li>
 <li class=""><bbb><%=counts%></bbb>  </li>
 <li class="alt"><name><%=useName%></name>  </li>
 <li class=""><conts><%=useMsg%></conts>  </li>
 <li class="alt"><ip><%=useIp%></ip>  </li>
 <li class=""></items>  </li>
 <li class="alt"><%   </li>
 <li class="">}   </li>
 <li class="alt">}else if(clien > counts){   </li>
 <li class="">for(int i=clien; i<21; i++){   </li>
 <li class="alt">String useName = (String)application.getAttribute("names" + i);   </li>
 <li class="">String useMsg = (String)application.getAttribute("msgs" + i);   </li>
 <li class="alt">String useIp = (String)application.getAttribute("ips" + i);   </li>
 <li class="">%>  </li>
 <li class="alt"><items>  </li>
 <li class=""><name><%=useName%></name>  </li>
 <li class="alt"><conts><%=useMsg%></conts>  </li>
 <li class=""><ip><%=useIp%></ip>  </li>
 <li class="alt"></items>  </li>
 <li class=""><%   </li>
 <li class="alt">}   </li>
 <li class="">for(int m=1; m<=counts; m++){   </li>
 <li class="alt">String useNameM = (String)application.getAttribute("names" + m);   </li>
 <li class="">String useMsgM = (String)application.getAttribute("msgs" + m);   </li>
 <li class="alt">String useIpM = (String)application.getAttribute("ips" + m);   </li>
 <li class="">%>  </li>
 <li class="alt"><items>  </li>
 <li class=""><name><%=useNameM%></name>  </li>
 <li class="alt"><conts><%=useMsgM%></conts>  </li>
 <li class=""><ip><%=useIpM%></ip>  </li>
 <li class="alt"></items>  </li>
 <li class=""><%   </li>
 <li class="alt">}   </li>
 <li class="">}else if(clien == counts){   </li>
 <li class="alt">  </li>
 <li class="">}   </li>
 <li class="alt">%>  </li>
 <li class=""></ppl>  </li>
</ol>
</div>
 
index.html 
<div class="code_title">html 代码</div>
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-xml">
 <li class="alt"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  </li>
 <li class=""><html xmlns="http://www.w3.org/1999/xhtml">  </li>
 <li class="alt"><head>  </li>
 <li class=""><meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  </li>
 <li class="alt"><title></title>  </li>
 <li class=""><link href="images/chatstyle.css" rel="stylesheet" type="text/css" />  </li>
 <li class="alt">  </li>
 <li class=""><script type="text/javascript" src="js/display.js"></script>  </li>
 <li class="alt"><script type="text/javascript" src="js/chat.js"></script>  </li>
 <li class=""><script type="text/javascript" src="js/tw-sack.js"></script>  </li>
 <li class="alt">  </li>
 <li class=""></head>  </li>
 <li class="alt"><body>  </li>
 <li class=""><div id="zt"></div>  </li>
 <li class="alt"><div id="loadifo"></div>  </li>
 <li class=""><div id="outs"><div id="outmain"><div id="chatmain"></div></div></div>  </li>
 <li class="alt"><div class="in">昵称：   </li>
 <li class=""

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论