利用cookie，实现刷新页面跳转，左侧菜单点击后状态保持不变。

Posted 2020-10-28 葫芦娃啊

是一个后台关系系统，后台是phyton，后台把左侧菜单都是利用a标签进行跳转，导致菜单点击状态在页面刷新后失效，用户体验不好，被要求改掉。

查了一些资料。利用cookie终于搞定了这个大问题。主要利用 cookie记录存值。

代码贴上去，以防忘掉

$(".nav-item li a").click(function(){
$.cookie("navstation", $(this).html(), { path: "/" });
});

var navstation = $.cookie("navstation");
if(navstation != null){
$(".nav-item li a").each(function(){
if($(this).html() == navstation){
$(this).parents(‘.nav-item‘).css("display","block");
$(this).addClass("current");
}


});
}

$(‘.cookieli‘).click(function(){
var index=$(this).index();
var iscookie=$(‘.cookieli‘).eq(index).find(‘.cookie-nav‘).css(‘display‘);
if(iscookie=="block"){
$(‘.cookieli‘).eq(index).find(‘.cookie-nav‘).css("display","none");
}else if(iscookie=="none"){
$(‘.cookieli‘).eq(index).find(‘.cookie-nav‘).css("display","block");
}
})