保留以前由jquery隱藏的div在重新加載頁面上打開

-1

我有兩個div。一個充當聊天窗口啓動器。聊天窗口元素默認隱藏。當我點擊聊天窗口啓動器元素時，聊天窗口出現，啓動器隱藏。我還爲聊天窗口做了一個小的關閉按鈕，以反轉操作。保留以前由jquery隱藏的div在重新加載頁面上打開

問題是，當我重新加載頁面時，聊天窗口消失，我不得不重新啓動。我該怎麼做，以便一旦啓動了啓動器，即使在頁面重新加載時，聊天窗口仍然可見，因此我只能使用關閉按鈕關閉它。

HTML

<div class="chat-launcher" title="Launch Chat Window"> 
    <span class=" glyphicon glyphicon-pencil chat-launcher-pencil " style="color: #ffffff;font-size: 20px;"></span> 
</div> 
<div class="chat-window "> 
    <span id="close">X</span> 
</div>

jQuery的

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.chat-launcher').on('click', function() { 
      $('.chat-window').show(); 
      $('.chat-launcher').hide(); 
     }); 
    }); 

    $(document).ready(function(){ 
     $('#close').on('click',function(){ 
      $('.chat-window').hide(); 
      $('.chat-launcher').show(); 
     }); 
    }); 
</script>

來源

2017-01-02 Caleb Amolo

您可以使用服務器端會話或cookie來跟蹤打開或關閉的窗口。最好用會話ID向服務器發送一些ajax通知。 –

將它的狀態存儲在localStorage或服務器端會話或cookie中，以及頁面加載時是否檢查該狀態並作出反應 – charlietfl

您是否正在使用'history.back（）'操作，方法是按下瀏覽器上的後退按鈕？除非您正在執行AJAX查詢或使用會話或cookie，否則該頁面應該始終加載相同的內容。爲防止頁面緩存，您可以在不想更改的頁面上使用'onunload = function（）{}'，就像這樣，當客戶端點擊後退按鈕時，您將無法獲得緩存狀態。 – PHPglue

你爲了保存聊天窗口的狀態需要一個持久存儲;如服務器端會話，客戶端Cookie或localStorage。

利用localStorage，這將是沿着線的東西：

$(document).ready(function() { 
    $('.chat-launcher').on('click', function() { 
     $('.chat-window').show(); 
     $('.chat-launcher').hide(); 

     // Set a flag indicating that the char window is open 
     localStorage.setItem('chatWindowOpen', true); 
    }); 

    $('#close').on('click',function(){ 
     $('.chat-window').hide(); 
     $('.chat-launcher').show(); 

     // Remove the flag 
     localStorage.removeItem('chatWindowOpen'); 
    }); 

    // Open chat window if the flag is there 
    if (localStorage.getItem('chatWindowOpen')) { 
     $('.chat-launcher').trigger('click');  
    }   
});

另外一個音符;正如您可能已經注意到的，您不需要多個$(document).ready()調用。一個人會爲所有人做。

來源

2017-01-03 00:26:30 sepehr

保留以前由jquery隱藏的div在重新加載頁面上打開

回答

相關問題