【问题标题】:remove() does not work删除()不起作用
【发布时间】: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


【解决方案1】:

else 子句作为超时函数的结果执行。将 console.log(currentConversation) 添加到超时函数的结果是什么?您确定在调用超时函数时 html 元素已经存在吗?要对此进行测试,您可以执行以下操作,假设 data.person 已正确填充。

if($("#"+data.person).length){ console.log(data.person+" html id exists."); }
else {console.log(data.person+" html element does not exist.");}

在第一个子句中插入您的逻辑将成功执行第二个不需要的删除语句,因为该元素不再存在。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-05-25
    • 2018-10-18
    • 2010-09-06
    • 2014-11-24
    • 2011-08-03
    • 2018-12-24
    • 2015-02-09
    相关资源
    最近更新 更多