jquery聊天 - 顯示新消息

我已經做了一個聊天的PHP和jQuery。jquery聊天 - 顯示新消息

它工作正常，但我有一個小問題：

我加載信息每5秒，但我加載所有與比它滾動到底部。

我怎樣才能改變這種只加載新的消息：

那jquery的索引：

function LoadChatVerlauf() { 

        $('.messages').empty(); 

    $.getJSON('infos.php', {'getchat':1 }, function(data) { 

       for(var key in data) { 
        var classe = ''; 


        if(data[key].chat_username == '<?php echo $user; ?>') { 
         classe = 'i'; 
        } else { 
         classe = 'friend-with-a-SVAGina'; 
        } 

         $('.messages').append('<li class="'+classe+'"><div class="head"><span class="time">'+data[key].chat_time+', '+data[key].chat_date+' </span><span class="name">'+data[key].chat_user+'</span></div><div class="message">'+data[key].chat_nachricht+'</div></li>'); 

        } 

      })//.fail(function() { alert('Unable to fetch data, please try again later.') }); 


     BOTTOM(); 

    }

那php文件：

if(isset($_GET['getchat'])){ 


    $array = array(); 


    $sql = "SELECT user, username, nachricht, date, time FROM chat_verlauf ORDER BY date, time LIMIT 60"; 

    $res = mysqli_query($db, $sql); 

    if(mysqli_num_rows($res) > 0) { 

     while($ds = mysqli_fetch_object($res)) 
     { 
      $time = date("H:i:s", strtotime($ds->time)); 
      $date = date("d.m.Y", strtotime($ds->date)); 

      array_push($array, array(
       'chat_user' => $ds->user, 
       'chat_username' => $ds->username, 
       'chat_nachricht' => $ds->nachricht, 
       'chat_date' => $ds->date, 
       'chat_time' => $ds->time 
      )); 
     } 

     echo json_encode($array); 
    } else { 

    } 



}

和HTML：

<ul class="messages"> 

    </ul>

我工作與jquery沒有多大關係！我不知道我該怎麼做。我希望有人可以幫助我

來源

2016-07-07 joergi1988

可以使用append功能來添加新的HTML標籤

$('.showMsgArea').append(msg);

來源

2016-07-07 16:14:25

我使用附加。但用這個jquery我用它清空div並加載所有新的evry 5秒。我怎麼做，只加載新消息？ – joergi1988

如果你在談論空的div和AJAX有史以來5s，比我可以幫你:) https://jsfiddle.net/moongod101/zboa3cto/ –

我的建議是：

1）使用root DIV ID不用彷徨當前HTML（即$（'＃testBlock'）。html（））;

2）將一個div放在您從上面命令獲得的html中。在添加的div內添加當前消息。

來源

2016-10-13 10:59:43

jquery聊天 - 顯示新消息

回答

相關問題