👀 Views: 62 💬 Answers: 1 📅 Created: 2025-06-24

html ios safari localstorage HTML

I just started working with I tried several approaches but none seem to work. I recently switched to I've searched everywhere and can't find a clear answer. I'm sure I'm missing something obvious here, but I'm working on a personal project and I’m working with an scenario with the HTML `<details>` and `<summary>` elements where the state does not retain correctly in Mobile Safari. When I open a `<details>` element on my webpage and navigate away to another page, then return, the details are collapsed again, despite them being expanded when I left. I'm testing on iOS 16.1, and this behavior seems inconsistent with how it operates on desktop browsers. Here's a minimal example of my implementation: ```html <details id="myDetails"> <summary>More Info</summary> <p>This is additional information that may be useful.</p> </details> ``` I've also included some JavaScript to try and manually save the state in localStorage: ```javascript const detailsElement = document.getElementById('myDetails'); // Restore state on page load window.onload = () => { const savedState = localStorage.getItem('detailsState'); if (savedState === 'open') { detailsElement.open = true; } }; // Save state on toggle detailsElement.addEventListener('toggle', () => { localStorage.setItem('detailsState', detailsElement.open ? 'open' : 'closed'); }); ``` This works fine on desktop browsers, but the `open` attribute does not seem to continue in Mobile Safari. I've also checked if there are any CSS issues or conflicting JavaScript that might affect the rendering, but everything seems fine. Has anyone else encountered this scenario or have any suggestions on how to ensure the `<details>` state retains its value even after navigating away? This is part of a larger service I'm building. Any help would be greatly appreciated! Any help would be greatly appreciated! The stack includes Html and several other technologies. What would be the recommended way to handle this? This is for a microservice running on Ubuntu 20.04. Has anyone else encountered this? Thanks, I really appreciate it! Any ideas what could be causing this?