我有几个div,用户可以使用jquery toggle方法最小化或扩展它们。但是,刷新页面后,div将返回到默认状态。是让浏览器记住div的最后一个状态的方法吗?
例如,如果我展开一个id为“my_div”的div,然后单击页面上的其他内容,然后返回到原始页面,我希望“my_div”保持展开状态。
我想可以使用会话变量来实现这一点,也许当用户单击expand/minimize按钮时,可以发送ajax请求并切换会话变量……idk……有什么想法吗?
最佳答案
不需要ajax请求,只需将信息存储在cookie或localstorage中。
这里有一个图书馆可以帮助你:http://www.jstorage.info/
一些示例代码(未测试):
// stores the toggled position
$('#my_div').click(function() {
$('#my_div').toggle();
$.jStorage.set('my_div', $('#my_div:visible').length);
});
// on page load restores all elements to old position
$(function() {
var elems = $.jStorage.index();
for (var i = 0, l = elems.length; i < l; i++) {
$.jStorage.get(i) ? $('#' + i).show() : hide();
}
});