頁面加載聊天窗口的存儲狀態

我正在製作一個聊天應用程序，我的聊天窗口打開或摺疊。所以我想要做的是我要存儲這些聊天窗口的狀態，無論它們是打開還是摺疊。在頁面刷新狀態應該保持。它可以使用cookie或會話完成，但我沒有得到如何完全做到這一點。我如何使用cookie或會話存儲這些div的狀態。這是我的jQuery代碼。頁面加載聊天窗口的存儲狀態

$(document).ready(function(){ 




     $(".shout_msg").click(function(){ 

      var id = $(this).attr('id'); 
      var name = $(this).text(); 
      //var myarray = []; 
      var sender = "<?php echo $user_check?>"; 
      var receiver = name; 

      var detect = detectClick(id); 

      if(!detect){ 
       $('#chatboxcontainer').append("<div id = 'd-"+id+"' class = 'shout_box1'></div>"); 
       $("#d-"+id).append("<div id = 'h-"+id+"' class = 'header1'>'"+name+"'</div>"); 
       $("#h-"+id).append("<div id = 'c-"+id+"' onclick = 'Slide("+id+")' class='close_btn1'>&nbsp;</div>") 
       $("#d-"+id).append("<div id = 't-"+id+"' class = 'toggle_chat1'></div>"); 
       $("#t-"+id).append("<div id = 'm-"+id+"' class = 'message_box1'></div>"); 
       $("#t-"+id).append("<div id = 'u-"+id+"' class = 'user_info1'></div>"); 
       $("#u-"+id).append('<input name = "shout_message" id = "s-'+id+'" type = "text" placeholder = "Type Message Hit Enter" />'); 

       //alert(id); 


       $.ajax({ 

          url: "loadmessage.php", 
          type: "POST", 
          data:{ 
           'sender': sender, 
           'receiver': receiver, 
          }, 

          success: function(response){ 
           var result = JSON.parse(response); 
           console.log("Result is " +result); 
           console.log() 

           for(var i in result){ 
            $("#m-"+id).append('<p class = "shout_msg">' +result[i]+ '</p>'); 
            $("#m-"+id).scrollTop($("#m-"+id)[0].scrollHeight); 
           } 
          } 
         }); 
       } 




      $("#s-"+id).keypress(function(evt) { 
       if(evt.which == 13) { 

        var msg = $("#s-"+id).val(); 
        //msg = msg.replace(":)","<img src = 'smilenew.gif'/>"); 

        var dt = new Date(); 
        var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds(); 

        $("#m-"+id).append('<p class = "shout_msg" id = "'+count+'">'+sender+':'+msg+'<span class = "time">'+time+'</span></p>'); 

        $.ajax({ 

         url: "insertdatanew.php", 
         type: "POST", 
         data:{ 
          'sender': sender, 
          'receiver': receiver, 
          'msg': msg, 
          'time': time 
         }, 

         success: function(result){ 
          if(result == 'Y') 
          alert("Successful insertion"); 
         } 
        }); 


        $("#m-"+id).scrollTop($("#m-"+id)[0].scrollHeight); 
        //count++; 
        $("#s-"+id).val(""); 


       } 

      }); 

     }); 



    });

我的代碼是怎麼樣的？

來源

2014-11-03 Manx_Warrior

這已經提供。使用$（this）返回這個DOM對象的jQuery對象。對於屬性（id，title，href，src，text等），jQuery的開銷很大。 – 2014-11-03 05:27:46

如果你不需要支持舊瀏覽器（尤其是IE7或更早版本），那麼sessionStorage就是完美的選擇。下面的鏈接甚至提供了一個非常接近你要找的東西的例子。

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage#sessionStorage

例子：

// set the state 
sessionStorage.setItem('chatWindowState', 'closed'); // or 'open' 

// retrieve the state when the page loads 
var chatWindowState = sessionStorage.getItem('chatWindowState');

來源

2014-11-03 05:27:08

我的聊天窗口div是自動創建的。所以這就是我所面臨的困惑，我如何存儲動態創建的div的狀態。你能幫我參考一下我的代碼嗎？ – 2014-11-03 05:36:16

頁面加載聊天窗口的存儲狀態

回答

相關問題