HTML5 - Lưu dữ liệu bằng session storage

Lưu dữ liệu bằng session storage

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Storing Data with HTML5 Session Storage</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
// Check if the localStorage object exists
if(localStorage) {
	$(document).ready(function() {
		$(".save").click(function() {
			// Get input name
			var lastName = $("#lastName").val();
			
			// Store data
    		sessionStorage.setItem("last_name", lastName);
			alert("Your last name is saved.");
		});
		$(".access").click(function() {
			// Retrieve data
    		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>

Xem ví dụ


Tư vấn lộ trình CNTT 🤖