Storing data with HTML5 session storage examples




Storing data with HTML5 session storage examples

<!DOCTYPE html>
<html>
   <head>
      <title>Example of HTML5 Session Storage</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <script type="text/javascript">
         if(localStorage){
            $(document).ready(function(){
               $(".save").click(function(){
                  var lastName = $("#lastName").val();
                  sessionStorage.setItem("last_name", lastName);
                  alert("Your last name is saved.");
               });
               $(".access").click(function(){
                  alert("Hi, " + localStorage.getItem("first_name")
                  + " " + sessionStorage.getItem("last_name"));
               });
            });
         } else{
         alert("Sorry, your browser do not support local storage.");
      }
      </script>
   </head>
   <body>
      <form>
         <label>Last Name: <input type="text" id="lastName"></label>
         <button type="button" class="save">Save Name</button>
         <button type="button" class="access">Get Name</button>
      </form>
   </body>
</html>

Output