Потерять данные на странице обновления

Question

Я пытаюсь достичь того, что может показаться простой задачей, но это меня совершенно сбивает с толку.

Когда пользователь нажимает на элемент меню, страница обновляется, а пользователь заканчивается на другой странице.

Разница обновляется с обновленным текстом.

Проблема заключается в том, что когда страница обновляется, я теряю сообщение «Вы находитесь на новой странице», как сохранить обновленное сообщение на новой странице?

JQuery -

<script> 
    $(document).ready(function() { 

     $("li.sub-level").click(function (e) { 
      $('.mylink').html("You are on a new page"); 

     }); 

    }); 

</script> 

HTML -

<div class="mylink">My link</div> 

Answer 1

Вы должны сначала "сохранить" первое место в infoObj, я предлагаю вам сделать это с URL первой страницы. Это предотвратит появление строки «Вы на новой странице», когда находитесь на первой странице.

$(document).ready(function() { 
    var infoObj = {}; 
    var url = window.location.href; 

    if (localStorage.myLink != null) { 
     infoObj = JSON.parse(localStorage.myLink) 
     if (infoObj.url == url) { 
     $('.mylink').html(infoObj.text); 
     } 
    } 

    $("li.sub-level").click(function(e) { 
     infoObj = { 
     url: "PUT YOU FIRST PAGE URL HERE", 
     text: "You are on a new page" 
     } 
     localStorage.myLink = JSON.stringify(infoObj) 
    }); 
}); 

Answer 2

Я думаю, вам стоит посетить эту ссылку. я надеюсь, что вы получите ответ.

Ссылка здесь Demo Link

Или пользователь этот код ниже. как работает sessionStorage.

<script> 
    // Run on page load 
    window.onload = function() { 

     // If sessionStorage is storing default values (ex. name), exit the function and do not restore data 
     if (sessionStorage.getItem('name') == "name") { 
      return; 
     } 

     // If values are not blank, restore them to the fields 
     var name = sessionStorage.getItem('name'); 
     if (name !== null) $('#inputName').val(name); 

     var email = sessionStorage.getItem('email'); 
     if (email !== null) $('#inputEmail').val(email); 

     var subject= sessionStorage.getItem('subject'); 
     if (subject!== null) $('#inputSubject').val(subject); 

     var message= sessionStorage.getItem('message'); 
     if (message!== null) $('#inputMessage').val(message); 
    } 

    // Before refreshing the page, save the form data to sessionStorage 
    window.onbeforeunload = function() { 
     sessionStorage.setItem("name", $('#inputName').val()); 
     sessionStorage.setItem("email", $('#inputEmail').val()); 
     sessionStorage.setItem("subject", $('#inputSubject').val()); 
     sessionStorage.setItem("message", $('#inputMessage').val()); 
    } 
</script>