Take the 2-minute tour ×

I have a page that toggles a divs visibility to visible after it completes an action, then navigates to a new page. If on the new page, I click back, the dom retains it's state and the div is visible, if I refresh and click back, the hidden attribute is missing. Is there any way to persist any changes to the dom after refresh/back.

share|improve this question
add comment

2 Answers

You can store the state of the visibility in HTML5's local storage.

When toggling the visibility, you can use a line like:

window.localStorage.setItem('boxVisibility', true /* or false, as it may be */);

and then add a window load event to set that box's visibility when the page loads:

document.addEventListener('load', function() {
    var isVisible = window.localStorage.getItem('boxVisibility');
    // now set the box's visibility with the value of isVisible
}, false);
share|improve this answer
add comment

LocalStorage is a good idea, for this cookies will work as well. You can use the jQuery Cookie plugin to make it simple to do: https://github.com/carhartl/jquery-cookie

share|improve this answer
add comment

Your Answer


