2017-01-19 4 views
1

Есть ли способ проверить последний добавленный div?Проверить последний div

Я хочу знать это, потому что я делаю чат-приложение с socket.io и bootstrap.

Я новичок в использовании javascript и jquery. Если я отправил сообщение, и последнее сообщение было также от меня, я хочу, чтобы мой текст добавлялся к панели, которую я использую.

Как это: example

Надеюсь, кто-нибудь знает это такое.

Заранее благодарен!

Код:

socket.on('newmsg', function (data) { 
    if (user) { 
     if (data.user == user) { 
      document.getElementById('message-container').innerHTML += '\ 
      <div class="row">\ 
       <div class="col-lg-1"></div>\ 
       <div class="col-lg-5">\ 
        <div class="panel panel-success">\ 
         <div class="panel-heading">'+data.user+'</div>\ 
         <div class="panel-body">\ 
          <div class="row">\ 
           <div class="col-lg-10">\ 
            '+data.message+'\ 
           </div>\ 
           <div class="col-lg-2">\ 
            '+data.time+'\ 
           </div>\ 
          </div>\ 
         </div>\ 
        </div>\ 
       </div>\ 
      </div> \ 
      '; 
     } 
     else { 
      document.getElementById('message-container').innerHTML += '\ 
      <div class="row">\ 
       <div class="col-lg-6"></div>\ 
       <div class="col-lg-5">\ 
        <div class="panel panel-primary">\ 
         <div class="panel-heading">'+data.user+'</div>\ 
         <div class="panel-body">\ 
          <div class="row">\ 
           <div class="col-lg-10">\ 
            '+data.message+'\ 
           </div>\ 
           <div class="col-lg-2">\ 
            '+data.time+'\ 
           </div>\ 
          </div>\ 
         </div>\ 
        </div>\ 
       </div>\ 
      </div> \ 
      '; 
     } 

    } 
}) 
+0

Показать код, который вы пробовали. –

+0

Вы не указали какой-либо код, поэтому вам трудно дать окончательный ответ, но вы можете использовать селектор ': last', чтобы найти конечный элемент, содержащийся в родительском элементе, например' $ ('# chat-messages .message: последний ') '. Я предлагаю вам прочитать документацию, чтобы узнать, что вы можете сделать с этим элементом: http://api.jquery.com –

+0

Вот код, чтобы добавить новое сообщение @AtaurRahmanMunna Теперь я хочу проверить последний текст заголовка панели чтобы проверить, было ли последнее сообщение от меня или другого лица –

ответ

1

Вы можете добавить свой Div элемент с сообщением, наконец, с помощью jquery

var addedText = '<div> this is second message</div>'; 
 
$('#msgGroup > div').last().append(addedText);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="msgGroup"> 
 
    <div>this is first msg</div> 
 
</div>
См jsFiddle тоже.

-1

https://api.jquery.com/last-selector/ Прочитайте это. Вы можете использовать $ ("DIV: последний")

$("div.panel-body div.row:last").css("color","red")
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <html> 
 
    <div class="panel-body"> 
 
    <div class="row">First row</div> 
 
    <div class="row">Second row</div> 
 
    </div> 
 
    </html>

+0

Могу ли я также получить всю информацию об этом div с этой функцией? Как текст заголовка панели –

+0

@BharatPatidar Какое приложение чата вы видели, когда сообщения добавляются в середину чата? –

+0

Я хочу, чтобы это выглядело как моя собственная сеть whatsapp –

Смежные вопросы