[英]Save Javascript toggle state with cookie
我想保存站点标题显示的状态。 如何使用Jquery Cookie保存它?
(function ($) {
// The initial load event will try and pull the cookie to see if the toggle is "open"
var openToggle = getCookie("show") || false;
if ( openToggle )
div.style.display = "block";
else
div.style.display = "none";
if ( window.location.pathname == '/' ){
// Index (home) page
div.style.display = "block";
}
// The click handler will decide whether the toggle should "show"/"hide" and set the cookie.
$('#Togglesite-header').click(function() {
var closed = $("site-header").is(":hidden");
if ( closed )
div.style.display = "block";
else
div.style.display = "none";
setCookie("show", !closed, 365 );
});
});
您在这里有几个问题。 首先,您正在定义类似IIFE的函数包装器,但是您从未调用它,因此您的代码将无法运行。 您需要在最后添加(jQuery)
以传递引用,或者如果您打算使用实际的document.ready
事件处理程序。
其次,Cookie只存储字符串,因此您需要将字符串转换为布尔值(这是使用JS的数据类型的雷区),或者可以只比较字符串。 尝试这个:
(function($) { var $div = $(div); var openToggle = getCookie("show") == 'true'; $div.toggle(openToggle); if (window.location.pathname == '/') $div.show(); $('#Togglesite-header').click(function() { var closed = $("site-header").is(":hidden"); $div.toggle(closed); setCookie("show", !closed, 365); }); })(jQuery);
还有两件事要注意。 首先,我将其修改为使用jQuery。 如果您已经加载了它,则还可以利用它的简单性来减少代码的详细程度。
其次,假设您的getCookie()
和setCookie()
函数正在运行; 您尚未显示其实现,但是由于有许多可行的示例,我认为这不是您的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.