Storing data with HTML5 local storage examples




Storing data with HTML5 local storage examples

<!DOCTYPE html>
<html>
   <head>
      <title>Example of HTML5 Local 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 firstName = $("#firstName").val();
                  localStorage.setItem("first_name", firstName);
                  alert("Your first name is saved.");
               });
               $(".access").click(function(){
                  alert("Hi, " + localStorage.getItem("first_name"));
               });
            });
         } else{
            alert("Sorry, your browser do not support local storage.");
         }
      </script>
   </head>
   <body>
      <form>
         <label>First Name: <input type="text" id="firstName"></label>
         <button type="button" class="save">Save Name</button>
         <button type="button" class="access">Get Name</button>
      </form>
   </body>
</html>

Output