我有一个基于按钮点击扩展/折叠到自动高度的div.我的工作正常,但我想使用
jquery.cookie.js来记住用户是否扩展它,以便它在页面刷新时保持打开状态.我看过类似的问题
例如Keep toggle state on divs using cookie.js after page refresh
但是我似乎无法让这个适用于我的情况.它不仅仅是一个简单的显示/隐藏,而且我无法确定正确设置和使用cookie的语法.这是我的工作代码的小提琴,也许有人可以帮助我？
这是相关代码：
$('#viewless').hide();
$('#viewmore').click(function(){
var el = $('#resize01'),curHeight = el.height(),autoHeight = el.css('height','auto').height();
el.height(curHeight).animate({height: autoHeight},500);
$('#viewmore').toggle();
$('#viewless').toggle();
});
$('#viewless').click(function(){
$('#resize01').animate({height: '190'},500);
$('#viewmore').toggle();
$('#viewless').toggle();
});
解决方法
尝试
$('#viewless').hide();
$('#viewmore').click(function(){
var el = $('#resize01'),500);
$('#viewmore').hide();
$('#viewless').show();
$.cookie('viewmore',true);
});
$('#viewless').click(function(){
$('#resize01').animate({height: '190'},500);
$('#viewmore').show();
$('#viewless').hide();
$.cookie('viewmore',false);
});
if($.cookie('viewmore') == 'true'){
$('#viewmore').click();
} else {
$('#viewless').click();
}
演示：Fiddle
