我无法找到涉及使用 cookie 的问题的解决方案。基本思想是,当用户单击选项卡时,会触发 jQuery on click 事件,并且下面显示的内容会发生变化。是否可以在页面刷新后存储页面的最新状态?
HTML代码如下所示
<ul>
<li id='column1'><a href='#' class='current'>column1</a></li>
<li id='column2'><a href='#'>column2</a></li>
<li id='column3'><a href='#'>column3</a></li>
</ul>
<div id='displayContent'>
*Content displayed here*
</div>
jQuery 代码如下所示
$("#column1").click(function(){
$("#column3").hide();
$("#column2").hide();
$("#column1").css("display", 'block');
$("#column3 a").removeClass();
$("#column2 a").removeClass();
$("#column1 a").addClass("current");
});
所以基本上它的工作原理是,当您单击一列时,将显示所需选择的内容,并将“当前”类添加到选择中。我需要找到一个解决方案,让浏览器记住最后点击的是哪一列,以便在刷新页面时它能记住最后一列。
谢谢!
更新 - JQUERY 代码
好的,所以下载 cookie 插件并将其添加到我的文件夹并进行设置。我现在已将我的 jQuery 代码更改为以下代码
$("#column1").click(function(){
$("#column3Content").hide();
$("#column2Content").hide();
$("#column1Content").css("display", 'block');
$("#column3 a").removeClass();
$("#column2 a").removeClass();
$("#column1 a").addClass("current");
$.cookie("column1", 1);
$.removeCookie("column2");
$.removeCookie("column3");
});
var cookieVal = $.cookie("column1");
if ( cookieVal == 1)
{
$("#column3Content").hide();
$("#column2Content").hide();
$("#column1Content").css("display", 'block');
$("#column3 a").removeClass();
$("#column2 a").removeClass();
$("#column1 a").addClass("current");
}
它现在会记住上次单击的是哪一列,耶!不幸的是,当它检查存在哪个 cookie 时,它似乎没有重新添加“当前”类,该类用于更改所选列的颜色,有什么想法吗?
最佳答案
How do I set/unset cookie with jQuery?
要开始,请参阅上面的链接。只需创建一个 cookie 并读取值。
$.cookie("jar", 1);
var cookieVal = $.cookie("jar");
$.removeCookie("jar");
更新
$("#column1").click(function(){
$("#column3").hide();
$("#column2").hide();
$("#column1").css("display", 'block');
$("#column3 a").removeClass();
$("#column2 a").removeClass();
$("#column1 a").addClass("current");
$.cookie("column1", 1);
});
var cookieVal = $.cookie("column1");
if ( cookieVal == 1 )
{
$("#column3").hide();
$("#column2").hide();
$("#column1").css("display", 'block');
$("#column3 a").removeClass();
$("#column2 a").removeClass();
$("#column1 a").addClass("current");
}
关于javascript - 如何将 cookie 与点击事件显示的内容一起使用? (HTML/CSS/jQuery),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34964406/