首页 > 解决方案 > 如何在 MessageBox 中显示最近的消息?

问题描述

我正在使用 jquery 和 javascript 来显示消息,在后端我正在反转消息列表,但它显示第一条消息,但我需要最近发送和接收的消息。

 function scrollToLatestChatMessage(chatContainer) {
   console.log("Entry::scrollToLatestChatMessage in chat.js "+chatContainer);
   $(".msg_container_base").animate({
     scrollTop : $('.msg_container_base')[0].scrollHeight
   });
  console.log("Entry::scrollToLatestChatMessage in chat.js ");
}       
  var str = '<div class="popup-box chat-popup chat-window" id="channel-'
        + channelId
        + '">'
        + ' <div class="col-xs-12 col-md-12">'
        + ' <div class="panel panel-default">'

        + '  <div class="top-bar">'
        + '       <div class="col-md-9 col-xs-9">'
        + '<img src="'
        + imageName
        + '" class="img-chat-box  img-thumbnail" >'
        + '<span>'
        + name
        + '</span>'
        + '</div><div class="col-md-3 col-xs-3" style="text-align: right;">'
        + '<a href="javascript:void(0)"><span id="minim_chat_window" class="glyphicon glyphicon-minus icon_minim"></span></a>'
        + ' <a href="javascript:close_popup(\''
        + channelId
        + '\')"><span class="glyphicon glyphicon-remove icon_close" data-id="chat_window_1"></span></a>'
        + ' </div></div>'

        + '<div class="panel-body msg_container_base">'
        + '<input type="hidden" name="friendId" id="friendId" value="'
        + toUserId
        + '"/>'
        + '<input type="hidden" name="channelId" id="channelId" value="'
        + channelId
        + '"/>'
        + '<input type="hidden" name="chatType" id="chatType" value="'
        + chatType
        + '"/>'
        + '</div>'
        + '<div class="panel-chat-footer">'
        + '<div class="input-group">'
        + '<input id="txtSendMessage" type="text"'
        + 'class="chat-text-box input-sm chat_input"'
        + ' placeholder="Write your message here..." required="required" /> <span'
        + ' class="input-group-btn">'
        + '<button class="btn btn-primary btn-sm" id="sentMessageBtn">Send</button>'
        + '</span>' + '</div>' + '</div>' + '</div>';
html = $.parseHTML(str), $("body").append(html);

它显示第一条消息,但我需要最近发送或接收的消息。聊天图像显示第一条消息。

在此处输入图像描述

标签: javascriptjquery

解决方案


尝试使用最新的方法

 function scrollToLatestChatMessage(chatContainer) {
   console.log("Entry::scrollToLatestChatMessage in chat.js "+chatContainer);
   $(".msg_container_base").animate({
     scrollTop : $('.msg_container_base').prop("scrollHeight")
   },1000);
  console.log("Entry::scrollToLatestChatMessage in chat.js ");
}

推荐阅读