如何实现jQuery边栏和Cookies
我已经通过jQuery API设置了一个侧栏。现在我注意到，当我刷新页面时，侧边栏将自动关闭。
我在互联网上发现了一个曲奇的东西，但由于某种原因，它不适用于我的侧边栏脚本。
我做错了什么？
$(document).ready(function() {
var sidebar_status = $.cookie("sidebar_status");
if (sidebar_status == null) {
$("a#ToggleSidebar").addClass('closed');
$("#sidebar").hide();
};
if (sidebar_status == "closed") {
$("a#ToggleSidebar").removeClass('open');
$("a#ToggleSidebar").addClass('closed');
$("#sidebar").css("display", "none");
};
if (sidebar_status == "open") {
$("a#ToggleSidebar").addClass('open');
};
$("a#ToggleSidebar").click(function() {
if ($("a#ToggleSidebar").attr("class") == 'open') {
$(this).removeClass('open');
$(this).addClass('closed');
$.cookie("sidebar_status", "closed", {
path: '/',
expires: 100
});
$("#sidebar").animate({
width: 'hide',
opacity: 'hide'
}, 'slow');
} else {
$(this).removeClass('closed');
$(this).addClass('open');
$.cookie("sidebar_status", "open", {
path: '/',
expires: 100
});
$("#sidebar").animate({
width: 'show',
opacity: 'show'
}, 'slow');
}
});编辑：
有类似于按钮<a href="#"></a>的东西，它应该打开一个<div></div>。现在，我希望当有人第一次访问页面时，<div></div>就关闭了。当用户单击<a href="#"></a>时，它将打开<div></div>并保存cookie。当用户现在刷新页面时，<div></div>应该保持打开状态，直到用户再次使用<a href="#"></a>关闭它。这就是我不能去工作的地方。
回答 2
Stack Overflow用户
发布于 2011-12-12 18:19:08
注释来自OP:现在侧边栏打开，一个cookie保存在计算机上，但是当我试图再次关闭侧栏时，什么都不会发生。
对于jQuery 1.6及以上，这个.
if ($("a#ToggleSidebar").attr("class") == 'open') {应该是这个(用attr替换为prop).
if ($("a#ToggleSidebar").prop("class") == 'open') {但这是最好的。
if ($("a#ToggleSidebar").hasClass("open")) {这..。
$(this).removeClass('open');
$(this).addClass('closed');....can就是这样写的(它叫做链式).
$(this).removeClass('open').addClass('closed');当我们在这的时候..。
这是：
if (sidebar_status == null) {
$("a#ToggleSidebar").addClass('closed');
$("#sidebar").hide();
};
if (sidebar_status == "closed") {
$("a#ToggleSidebar").removeClass('open');
$("a#ToggleSidebar").addClass('closed');
$("#sidebar").css("display", "none");
};
if (sidebar_status == "open") {
$("a#ToggleSidebar").addClass('open');
};...can是这样写的..。
if (sidebar_status == null) {
$("a#ToggleSidebar").addClass('closed');
$("#sidebar").hide();
} else if (sidebar_status == "closed") {
$("a#ToggleSidebar").removeClass('open').addClass('closed');
$("#sidebar").hide();
} else if (sidebar_status == "open") {
$("a#ToggleSidebar").addClass('open').removeClass('closed');
};(jQuery .hide() 等于 jQuery .css("display", "none");)
Stack Overflow用户
发布于 2011-12-11 16:41:29
看看我的答案，这里，jquery插件的情况是一样的，以及如何使用它。希望它能帮助或者至少引导你走向正确的方向。
https://stackoverflow.com/questions/8465578
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号