【发布时间】:2017-06-07 10:45:26
【问题描述】:
我正在尝试为聊天程序制作“检测打字”功能。
关于检测用户何时键入或发送消息的一切都有效,但 $("#"+data.person+"").remove(); 不起作用。
控制台正在打印“正在输入功能已停止 - 删除”,所以它应该可以工作。
对我缺少的内容有什么建议吗?另外,如果我应该添加更多代码,请告诉我。我只是假设这足以了解正在发生的事情。
客户端
var myUserName;
var myUserPassword;
var myUserID;
var currentConversation;
var conversationInvite;
$(document).ready(function() {
var socket = io.connect("localhost:3000");
var typing = false;
var timeout = undefined;
function timeoutFunction() {
typing = false;
socket.emit("typing", false, currentConversation);
}
$(document).on('pageshow', '#chat', function(e,data){
$('.chatContent').height(getRealContentHeight());
});
function getRealContentHeight() {
var header = $.mobile.activePage.find("div[data-role='header']:visible");
var footer = $.mobile.activePage.find("div[data-role='footer']:visible");
var content = $.mobile.activePage.find("div[data-role='content']:visible:visible");
var viewport_height = $(window).height();
var content_height = viewport_height - header.outerHeight() - footer.outerHeight();
if((content.outerHeight() - header.outerHeight() - footer.outerHeight()) <= viewport_height) {
content_height -= (content.outerHeight() - content.height());
}
return content_height;
}
//-----Chat
// Sending the message
$("#msg").keypress(function(e){
var msg = $("#msg").val();
if (e.which === 13) {
if (msg.trim() == "") {
return;
} else {
var timeInMs = Date.now();
function fulldate(date) {
var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
return months[date.getUTCMonth()] + ' ' + date.getUTCDate() + ', ' + date.getUTCFullYear();
}
var message = {
message_id: currentConversation,
message_sender: myUserName,
message_body: msg,
time: timeInMs,
date: fulldate(new Date(timeInMs))
};
socket.emit("send message", message, currentConversation);
$("#msg").val("");
$("#msg").focus();
clearTimeout(timeout);
timeoutFunction();
}
} else if (e.which !== 13) {
if (typing === false && $("#msg").is(":focus")) {
typing = true;
socket.emit("typing", true, currentConversation, myUserName);
clearTimeout(timeout);
timeout = setTimeout(timeoutFunction, 3000);
} else {
console.log("Timeout function started");
//clearTimeout(timeout);
timeoutFunction();
}
}
});
socket.on("isTyping", function(data) {
if (data.isTyping) {
if ($("#"+data.person+"").length === 0) {
$(".chatContent").append("<div id='"+ data.person +"'><span class='grey'>" + data.person + " is typing...</div>");
timeout = setTimeout(timeoutFunction, 5000);
console.log(data.person);
}
} else {
console.log(data.person);
$("#"+ data.person +"").remove();
console.log("is typing function stopped - remove");
}
});
});
服务器端
// Detect typing
socket.on("typing", function(data, currentConversation, myUserName) {
socket.broadcast.to(currentConversation).emit("isTyping", {isTyping: data, person: myUserName});
console.log("Someone is typing");
});
【问题讨论】:
-
你有没有试过使用
console.log(data.person)并检查值 -
还要检查通过检查生成的html!
-
@CarstenLøvboAndersen 请查看我更新的代码。如您所见,它第一次打印出正确的名称,但在“else”函数中它打印出未定义的名称。可能是什么问题?
-
如果打印的是 Undefined,你猜它应该如何删除一些东西
-
是的,我认为这是有道理的,但我的问题是,为什么它首先是未定义的?
标签: javascript jquery sockets jquery-mobile