Question

我正在使用phonegap开发一对一的聊天应用程序。我的问题是当用户点击联系人并发送消息时。然后用户单击返回按钮并单击另一个联系人，它仍然可以看到他刚刚发送给第一个用户的消息。

以下是我的代码的一部分：

这里使用ajax从服务器获取联系。当它成功时，它将生成一个列表视图以显示所有联系人。

$.each(contacts, function(i,item)
{
  output += '<li  data-name='+item+'><a href="#chat_page">' + item + '</a></li>';
  $('#contacts_list').html(output).listview('refresh');
  //Show the contact name on the front of chat page
  $('#contacts_list').children('li').on('click', function ()
  {
    var contact_name=$(this).attr('data-name');
    $('#contact_name').html(contact_name);
    get_name(contact_name);
  });
});

<!--When someone click a user in contacts, it will show the chat page-->
<div data-role="page" id="chat_page" data-role="page" data-theme="a">
<div data-role="header">
  <h1 id="contact_name"></h1>
</div>

<div data-role="content">
  <div id="incomingMessages" name="incomingMessages" class="msgContainerDiv" > 
  </div>
  <label for="messageText"><strong>Message:</strong></label>
  <textarea id="messageText"></textarea>

</div>

<div data-role="footer">

  <fieldset class="ui-grid-a">
    <div class="ui-block-a">
      <a href="#contacts_page" id="goBackButton" data-role="button">Go Back</a>  
    </div>
    <div class="ui-block-b">
      <button data-theme="a" id="chatSendButton" name="chatSendButton">Send
</input>
  </fieldset>

</div>

</div>

这是ajax代码的一部分，我使用ajax获取聊天数据，然后将它们添加到我的聊天页面。

success: function(data)
                 {
                 var get_data = JSON.parse(data);

                 $("#incomingMessages").append
                 (
                  "<div class='message'><span class='username'>" +
                  (get_data.from || 'Anonymous') +"</span> : " +
                  (get_data.message || ' ') + "</br>" +
                  (get_data.message_time || ' ')
                  +"</div>"
                  );
                 }
                 });

我知道原因是当用户点击联系时，它将始终转到同一页面，这就是为什么可以向所有用户看到消息的原因。

有没有解决方案？

提前致谢。

Answer 1

切换用户时，您应该清除#incomingMessages。当您想要用新用户的消息替换它时，您可能会将HTML内容留在该div中。

像

这样的东西

$('#incomingMessages').html('')

Answer 2

一个简单的解决方案是使用本地存储来存储每个用户的历史记录（#incomingMessages）和#messageText。

然后您可以清除#messageText，并在用户重新开启聊天时重新加载。

phonegap聊天应用程序用户可以看到其他消息

2 个答案: