LocalStorage无法添加“打开”类并将其保存下来
LocalStorage无法添加“打开”类并将其保存下来
提问于 2016-03-29 16:16:30
我使用LocalStorage保持一个开关横幅打开/关闭。不幸的是，我无法正确地实现在横幅的切换#按钮上保持一个打开的类，从而相应地改变它的样式。
我的代码：
$('#button').click(function () {
$(this).siblings().slideToggle(function() {
localStorage.setItem('display', $('#banner').is(':hidden'));
});
});
var block = localStorage.getItem('display');
if (block == 'true') {
$('#banner').hide()
}我的html
<div id="banner_container">
<div id="banner">
<img src="#">
</div>
<button id="button" href="javascript:void(0);"></button> <!-- toggle 'open' class if banner is visible / hidden and keep it in LocalStorage -->
</div> 我尝试将toggleClass ( $(this).toggleClass('open'); )设置为slideToggle函数，但这似乎不是正确的方法，因为它与LocalStorage行为无关。有什么建议吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2016-03-30 08:54:43
通过切换“activeClass”或“打开”并检查它是否存在于文档加载上，解决了问题。
$(document).ready(function() {
$('#button').click(function() {
$(this).siblings().slideToggle(function() {
localStorage.setItem('display', $('#banner').is(':hidden'));
});
});
var block = localStorage.getItem('display');
if (block == 'true') {
$('#banner').hide()
}
});
$(document).ready(function() {
$('#button').click(function() {
$('#button').toggleClass('activeClass');
});
});
$(document).ready(function() {
if (!$('#banner').is(':hidden')) {
$('#button').addClass('activeClass');
} else if (!$('#banner').is(':visible')) {
$('#button').removeClass('activeClass');
}
});JSFiddle：https://jsfiddle.net/fcewjh7a/17/
Stack Overflow用户
发布于 2016-03-29 20:57:32
将javascript封装在jquery文档中，就绪调用。您的问题是，隐藏横幅的javascript在DOM呈现横幅元素之前正在执行：
$(document).ready(function() {
$('#button').click(function () {
$(this).siblings().slideToggle(function() {
localStorage.setItem('display', $('#banner').is(':hidden'));
});
});
var block = localStorage.getItem('display');
if (block == 'true') {
$('#banner').hide()
}
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/36289696
复制相关文章
相似问题
腾讯云开发者
