0

phonegap を使用して、1 対 1 のチャット アプリケーションを開発しています。私の問題は、ユーザーが連絡先をクリックしてメッセージを送信するときです。次に、ユーザーが戻るボタンをクリックして別の連絡先をクリックすると、最初のユーザーに送信したばかりのメッセージが表示されます。

ここに私のコードの一部があります:

ここでは 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>"
                  );
                 }
                 });

ユーザーが連絡先をクリックすると、常に同じページに移動するため、すべてのユーザーにメッセージが表示されることが理由です。

これに対する解決策はありますか？

前もって感謝します。

4

2 に答える 2

0

#incomingMessages簡単な解決策は、ローカル ストレージを使用して履歴 ( ) を#messageTextユーザーごとに保存することです。

その後#messageText、ユーザーがチャットを再開したときに、クリアしてリロードすることができます。

于 2013-12-03T18:54:37.530 に答える
0

#incomingMessagesユーザーを切り替えるときにクリアする必要があります。HTML コンテンツを新しいユーザーのメッセージに置き換えたい場合、その div に HTML コンテンツを残している可能性があります。

何かのようなもの

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

于 2013-09-17T21:12:27.317 に答える