เหตุการณ์ onstorage จะถูกกระตุ้นเมื่อพื้นที่จัดเก็บข้อมูลเว็บ (localStorage หรือ sessionStorage) ถูกเปลี่ยนแปลงจากบริบทอื่น (เช่น แท็บ/หน้าต่างอื่นของโดเมนเดียวกัน) หมายเหตุ: เหตุการณ์นี้ ไม่ทำงาน ในแท็บเดียวกันที่ทำการเปลี่ยนแปลง
ตัวอย่างการใช้งาน
<!DOCTYPE html>
<html>
<head>
<title>ตัวอย่าง HTML onstorage</title>
</head>
<body onstorage="alert('พื้นที่จัดเก็บถูกอัปเดต!')">
<h2>ยินดีต้อนรับ</h2>
<p>ข้อความตัวอย่าง</p>
</body>
</html>รูปแบบการใช้งานที่แนะนำ (JavaScript)
window.addEventListener('storage', function(event) {
console.log('Key:', event.key);
console.log('Old Value:', event.oldValue);
console.log('New Value:', event.newValue);
console.log('Storage Area:', event.storageArea);
});กรณีการใช้งานทั่วไป
- ซิงโครไนซ์สถานะระหว่างแท็บหลายแท็บ
- อัปเดต UI เมื่อผู้ใช้ล็อกอิน/ล็อกเอาท์จากแท็บอื่น
- แจ้งเตือนการเปลี่ยนแปลงการตั้งค่าจากอุปกรณ์อื่น
