即时通讯

[fish_whale]

最近写一个客服的简单聊天系统，在接收客户聊天信息这里出现了问题，后台显示我已经成功接受了客户的信息，但是在客服页面该用户的聊天界面里却并没有显示，想请教一下怎么解决，
页面分为3个部分，左侧是在线用户，中间是聊天框，右侧显示当前聊天用户的一些信息
业务逻辑是，当用户上线时，左侧显示用户的头像ID之类的东西，下线时移除，当选中该用户时，右侧显示该用户的信息，聊天就像微信QQ一样，不过不支持群聊，显示接收客户消息那块总觉得很绕，直接上代码
//全局变量
var loginName = "";
var canNotUse = "0";
$(".messageBox").html('');
// 系统消息
function systemMessage(msg, type) {
$('#loginName').text(loginName + '（' + msg + '）');
canNotUse = "1";
}

/** 客服上线 */

//_CUSTOMER_ONLINE客服上线_SEPARATOR协议分隔符
function openOnline() {
// socket.send(_CUSTOMER_ONLINE + _SEPARATOR + customerId + _SEPARATOR
// + imgPath + _SEPARATOR + customerName);
ws.send(_CUSTOMER_ONLINE + _SEPARATOR + '1666' + _SEPARATOR +
'imgPath' + _SEPARATOR + 'customerName');
alert("客服以上线")
}
/** 客服离线 */
function closeOffline(evt) {
alert("客服已离线")
}
/** 用户上线 */
function userOnline(userId, userName, userImg, userType) {
// 在客户列表添加上线用户
var htmlUl = '<div class="chatLi" name="' + userId + '" onclick="showChatDiv(\'' + userId + '\')">' +
' <div class="chatList chatBuddha"><img src="../../../assets/img/user/mary.jpg" alt="" /></div>' +
' <div class="chatList chatState">' +
' <p>会员昵称</p>' +
' <span id="' + userId + '_type">' + userType + '</span>' +
' </div>' +
' <i class="chatList chatCount" name="' + userId + '"></i>' +
'</div>';
// $(".friendDiv").append(htmlUl);
$(".chatUl").append(htmlUl);
}

/** 发送消息 */
function sendMsg() {
if($("#userId").val() == "") {
alert('提示：您没有选择客户。');
return;
}
if($("#msgText").val() == "") {
alert('提示：您没有填写内容。');
return;
}
if($("#sendBtn").attr("msgType") == "0") {
var msgText = $("#msgText").val();
var userId = $("#userId").val();
console.log(userId);
var html = '<div class="mesListsend">' +
' <div class="chatBuddha fr"><img src="../../../lib/beyond/img/avatars/Stephanie-Walter.jpg" alt="" /></div>' +
' <div class="getBox fr">' +
' <span class="getTxt">' + msgText + '</span>' +
' <p class="everyTime">' + new Date().format("hh:mm") + '</p>' +
' </div>' +
'</div>';
$("#chatSer").append(html);
$("#msgText").val('');
ws.send(_TEXT_MSG + _SEPARATOR + _TOCLIENT + _SEPARATOR + '11' +
_SEPARATOR + msgText);
$('.chartMessage').scrollTop($('.messageBox').height());
// $("#sendBtn").attr("msgType", "1");
} else {
// 上传图片
// ajaxFileUploads();
}
// type值为0 表示文本消息发送
$("#sendBtn").attr("msgType", "0");

}

/** 显示接收到的文本消息*/
function showTextMsg(msg, userId, uname, uImg) {
var t = new Date().format("hh:mm");
var html = '<div class="mesListget">' +
' <div class="chatBuddha lf"><img src="../../../assets/img/user/mary.jpg" alt="" /></div>' +
' <div class="getBox">' +
' <span class="getTxt">' + msg + '</span>' +
' <p class="everyTime">' + t + '</p>' +
' </div>' +
// ' <i class="chatCount">1</i>' +
'</div>';
//将接收到的信息放在隐藏域中
$(".hiddenMsgBox" + userId).append(html);
// $(".messageBox").append(html);
$('.chartMessage').scrollTop($('.messageBox').height());
//如果chatPage的值是1，则在客服页面
if($("#chatPage").val() == "1") {
//chatLi左侧用户栏的name是用户的userId，如果userID相同，那么是当前会话
var divMsgFlag = $(".hiddenMsgBox" + userId);
var divFriFlag = $(".chatLi").attr("name");
if(divMsgFlag == divFriFlag) {
//将当前客户的消息从隐藏域中拿出放在中间聊天显示的div最下方
var divMsgId = $(".hiddenMsgBox" + userId).html();
alert(divMsgId);
$(".messageBox").html("");
$(".messageBox").append(divMsgId);
$('.chartMessage').scrollTop($('.messageBox').height());

} else {
//如果不是当前用户的会话，那么接收到的新消息放在用户列表的第一位
var moveUserHidden = $(".friendDiv div[name='" + userId + "']");
var moveUser = $(".chatUl div[name='" + userId + "']");
$(".friendDiv").prepend(moveUserHidden);
$(".chatUl").prepend(moveUser);
//角标
var userSpansHidden = $(".friendDiv i[name='" + userId + "i']");
var userSpans = $(".chatUl i[name='" + userId + "i']");
if(userSpansHidden.css("display") == "none") {
// handle non visible state
userSpansHidden.text('1');
userSpansHidden.show();
} else {
// handle visible state
var msgNum = userSpansHidden.html();
msgNum = parseInt(msgNum) + 1;
userSpansHidden.text(msgNum);
}
if(userSpans.css("display") == "none") {
// handle non visible state
userSpans.text('1');
userSpans.show();
} else {
// handle visible state
var msgNum = userSpans.html();
msgNum = parseInt(msgNum) + 1;
userSpans.text(msgNum);
}
}

} else {
//为根目录添加红点
}

}
// 显示聊天页面
function showChatDiv(userId) {
$("#userId").val(userId);
//移除当前样式
$(".chatLi").css("background", "none");
//给选择的客户添加样式
$(this).css("background", "#fff");
//移除菜单角标
$(this).find("i").css("display", "none");
//end
var url = "";
$.ajax({
url: url,
dataType: 'jsonp',
processData: false,
type: 'get',
success: function(data) {
console.log("成功后返回的数据：" + data);
var myLists = [];
//这里是用AJAX获取用户信息，我已经写好了，
myLists.push(myList);
$(".userInfoBox").prepend(myLists);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
}
});

}
/**
* 时间对象的格式化; new Date(data.book.otherPublishDate)).format("yyyy年MM月")
*/
Date.prototype.format = function(format) {
/*
* eg:format="yyyy-MM-dd hh:mm:ss";
*/
var o = {
"M+": this.getMonth() + 1, // month
"d+": this.getDate(), // day
"h+": this.getHours(), // hour
"m+": this.getMinutes(), // minute
"s+": this.getSeconds(), // second
"q+": Math.floor((this.getMonth() + 3) / 3), // quarter
"S": this.getMilliseconds()
// millisecond
}

if(/(y+)/.test(format)) {
format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 -
RegExp.$1.length));
}

for(var k in o) {
if(new RegExp("(" + k + ")").test(format)) {
format = format.replace(RegExp.$1, RegExp.$1.length == 1 ?
o[k] :
("00" + o[k]).substr(("" + o[k]).length));
}
}
return format;
}