在不同的页面上记住jQuery slideToggle
问题描述:
我有一个带有子菜单的菜单,当你点击子菜单打开的菜单名时,现在我想让浏览器记住哪个菜单是打开的,哪个菜单是不打开的。在不同的页面上记住jQuery slideToggle
这是菜单的
<div id="block">
<div class="flip1"><img src="/test/images/arrow_right.png"><div class="f1">Menu title</div></div>
<hr />
<div class="panel1">
<a href="">submenu title</a><br />
<a href="">submenu title</a>
</div></div>
和我的jQuery代码到目前为止
$(document).ready(function(){
//check if the menu should be open or not and open/hide it
var shouldShow = jQuery.cookie('show_desc') == 'yep';
if(shouldShow) {jQuery('.panel1').show();}
else {jQuery('.panel1').hide();}
//toggle submenu on click and make a cookie to remember if it should open or hide the menu
$(".f1").click(function(){
$(".panel1").slideToggle("fast");
if(shouldShow) {jQuery.cookie('show_desc', 'nope');}
else {jQuery.cookie('show_desc', 'yep'); }
});
});
我是非常有信心这是去上班,但事实证明它不子菜单中打开一个时页面加载并且不会对点击作出反应。我在这里做错了什么?任何帮助表示赞赏> _ <
编辑: 好了,经过一些研究,我改变了我的slideToggle函数将此: $(” F1" )点击(函数(){
$('.panel1').slideToggle('fast',function(){
if ($('.panel1').is(':hidden')) {
var state = "closed";
} else {
var state = "open";
}
});
jQuery.cookie('show_desc', state);
});
。
它的工作原理,但只有在没有开始时的cookie检查
var shouldShow = jQuery.cookie('show_desc') == 'open';
if(shouldShow) {jQuery('.panel1').show();}
else {jQuery('.panel1').hide();}
而且我不明白为什么这行不行?我该如何检查cookie的值,使之工作d:
答
您从来没有根据页面本身的状态设置shouldShow
的值 - 仅限于cookie的状态。单击菜单时,您需要根据菜单的状态更新Cookie,而不是shouldShow
的值(页面加载后从不更新)。