送信されたメッセージとは別のスタイルで着信メッセージを送信する

Question

着信テキストを別々にスタイルする方法はありますか？比較的簡単かもしれませんが、何日も苦労しています。

ここに私のユーザーのメッセージを取得するためのコードです。ここで

<textarea type='text' class='materialize-textarea' 
     name='user_message' id='user_message' placeholder='Type here...' 
     style='width: 70%;' 
</textarea> 

はここJS

(function(window, Pusher, $) { 

    Pusher.log = function(msg) { 
    if(window.console && window.console.log) { 
     window.console.log(msg); 
    } 
    }; 

Pusher.channel_auth_endpoint = "auth.php"; 

    var pusher = new Pusher(CONFIG.PUSHER.APP_KEY); 
    pusher.connection.bind('state_change', function(change) { 
    var el = $('.connection-status'); 
    el.removeClass(change.previous); 
    el.addClass(change.current); 
    }); 

    var channel = pusher.subscribe(CONFIG.PUSHER.CHANNEL_NAME); 
    channel.bind('new_message', addMessage); 

    function addMessage(data) { 
    var li = $('<li class="ui-li ui-li-static ui-body-c"></li>'); 
    li.text(data.text); 
    li.hide(); 
    $('#messages').append(li); 
    li.slideDown(); 
    } 


    $(document).keypress(function(e) { 
    if(e.which == 13) { 
    var userMessageEl = $('#user_message'); 
    var message = $.trim(userMessageEl.val()); 
    if(message) { 
     $.ajax({ 
     url: 'new_message', 
     type: 'post', 
     data: { 
      text: message 
     }, 
     success: function() { 
      userMessageEl.val(''); 
     } 
     }); 
    } 


    return false; 
    } 
    }); 

})(window, window['Pusher'], jQuery); 

を使用して、プッシャーための私のコードでメッセージを表示するための私のコードで私はPHPを使用して情報を送信した後、これは私のデータベースとユーザーにそれを保存し、作品ページを更新します。あなたはおそらく何をしたいのか

// Message sent by the user 
     if($row2[initiator] === $lgusername){ 
     echo ("<li class='text-right' 
     style='margin-top: 5px; margin-bottom: 5px; margin-left: 100px; padding: 10px; 
     background-color: #b2f2ec; border: 1px solid #ccc!important; 
     border-radius: 4px!important; text-color: #fff;'>" . $row2[msg] . "</li>"); 
     } 

     Received message 
     else { 
     echo ("<li class='text-left' 
     style='margin-top: 5px; margin-bottom: 5px; margin-right: 100px; padding: 10px; 
     background-color: #e4ffe1; border: 1px solid #ccc!important; 
     border-radius: 4px!important;'>" . $row2[msg] . "</li>"); 
     } 

Answer 1

はsenderIdとタグメッセージで、あなたがメッセージを受信したとき、あなたはそれを送信者に応じて異なることをフォーマットすることができます。だから、現時点ではあなたの代わりに、あなたがデータ

{ 
    text: "message text", 
    senderId: "someId" 
} 

をトリガーすることができ、あなたのaddMessage機能でメッセージをレンダリングするときに、あなたがdata.senderIdを確認することができ、データ

{ 
    text: "message text" 
} 

でメッセージをトリガされ、その値に応じてliを異なる形式でフォーマットします。