追加最後一條消息一次

你好傢伙我想與Jquery，php，ajax和mysql建立聊天室我幾天以來面臨的問題是，當我得到最後一條消息的值時，到div我想是附加的最後一條消息只有一次，再次追加如果有新的消息，這裏是我的Ajax調用追加最後一條消息一次

var chat = ""; 
    $.ajax({ 
      url: "php/gt_user.php", 
      type: "get", 
      success: function (result) { 
       var gtUser = $.parseJSON(result); 
       $.each(gtUser, function (idx, obj) { 
        var usrApp = "<span><i class='fa fa-user-circle-o' aria-hidden='true'></i>"; 
        usrApp += "<p class='usr-name'>" + obj.Tables_in_chat + "</p></span>"; 
        $('.userarea').append(usrApp); 
       }); // here i get all the username who sent a message and print them on a div 
       $('.userarea span').on('click', function() { 
        $('.msgarea').html(""); 
        var usrName = $(this).text(); 
        $('#usrname').text(usrName); 
        setInterval(function() { 
         $.ajax({ 
          url: "php/admin_msg.php", 
          type: "post", 
          data: { 
           name: usrName 
          }, 
          success: function (result) { 
           var lastmsg = result; 

           function appedn() { 
            var usrMsg = "<div class='usr-msg'><i class='fa fa-user-circle-o' aria-hidden='true'></i>"; 
            usrMsg += "<span><p>" + lastmsg + "</p></span></div>"; 
            $('.msgarea').append(usrMsg); 
           } 

           if (chat !== result) { 
            appedn(); 

           } else { 
            chat = result; 
           } 

          } 

         }); 
        }, 2000); 


       }); 
      } 
     });

從php/admin_msg.php的respanse的工作，我拿到了最後的消息成功地在問題在於這個腳本不斷地向消息區域添加相同的消息，而且我想要的是隻添加一次消息，如果有新的消息

來源

2017-07-02 Abdeslem Charif

你可以發佈來自php/admin_msg.php的迴應嗎？我會在響應中包含時間戳/消息ID，並且只接收新消息，在第一個請求上發送0，以及在下面的最新檢索消息ID。 – Benjaco

我終於能夠修復後第1天的鬥爭，從而將在此公佈answear以防萬一的問題，它會幫助另外一個人面臨着同樣的問題

的一部分，我必須讓所有的用戶名從數據庫表中我將其移動到我的HTML和使用PHP的幾行來呼應這樣的結果（每個用戶名都有自己的表）

// show all the user name that sent a message 
    $result = $con->query("show tables from chat"); 
    while($row = mysqli_fetch_assoc($result)){ 
     echo "<span><i class='fa fa-user-circle-o' aria-hidden='true'></i><p class='usr-name'>".$row['Tables_in_chat']."</p></span>"; 
    }

然後在我的jQuery腳本我感動的是檢查功能在點擊事件之外每隔2秒發送一次最後一條消息，這樣我的jquery腳本現在看起來更清晰了

/* get the user name and added it to the header of the message box */ 
    $('.userarea span').on('click', function() { 
      $('.msgarea').html(""); 
      var usrName = $(this).text(); 
      $('#usrname').text(usrName); 

     }); 
     var chatdata = ""; 
    /* check for new message and append the message area if there is a new one */ 
     setInterval(function() { 
      var usrName = $('#usrname').text(); 
      $.ajax({ 
       url: "php/admin_msg.php", 
       type: "post", 
       data: { 
        name: usrName 
       }, 
       success: function (result) { 
        function appedn() { 
         var usrMsg = "<div class='usr-msg'><i class='fa fa-user-circle-o' aria-hidden='true'></i>"; 
         usrMsg += "<span><p>" + result + "</p></span></div>"; 
         $('.msgarea').append(usrMsg); 
        } 

        if (chatdata !== result) { 
         appedn(); 
         chatdata = result; 
        } 
       } 
      }); 
     }, 2000);

來源

2017-07-02 22:37:29

你需要以某種方式識別已經附加到你的html最後的消息最好會從服務器發送一些ID。所以你的消息div應該包含一些data-id屬性，然後當你要求下一條消息時獲取$('.msgarea')元素的最後一個子元素，請閱讀data-id並與當前元素進行比較。

另一件我建議移動到一些視圖庫或框架，反應，角，vue或任何。當你想用純jQuery來管理這些功能時，它會變得複雜。

來源

2017-07-02 19:29:15 vrael560

是的我是所有最重要的，我認爲我應該放棄這個項目，只是因爲這個腳本的行爲，我教我錯過了一些東西，這就是爲什麼我在這裏發佈的問題 –

追加最後一條消息一次

回答

相關問題