Jquery 切换DIV状态本地存储
今天早些时候,我在这里问了一个问题,但没有正确解释,也没有提供正确的代码 我有两个带有链接的切换DIV,一旦用户打开一个并单击链接,页面就会刷新,结果会显示出来,但该DIV会自动关闭。 我希望它保持开放Jquery 切换DIV状态本地存储,jquery,toggle,local-storage,Jquery,Toggle,Local Storage,今天早些时候,我在这里问了一个问题,但没有正确解释,也没有提供正确的代码 我有两个带有链接的切换DIV,一旦用户打开一个并单击链接,页面就会刷新,结果会显示出来,但该DIV会自动关闭。 我希望它保持开放 $(document).ready(function() { $(".content").hide(); $(".fa-angle-double-up").hide(); $(".heading").click(functi
$(document).ready(function() {
$(".content").hide();
$(".fa-angle-double-up").hide();
$(".heading").click(function(){
$(this).next(".content").slideToggle(500);
$(this).find(".fa-angle-double-up, .fa-angle-double-down").toggle();
});
});
有人告诉我,这可以通过设置cookies或将其存储到本地存储来完成,但我不知道(JS newbie)。如果有人能帮忙,你可以帮我一把:)
主持人,如果发布两个主题相同的问题是违反规则的,我很抱歉,在您的点击事件中,您可以添加以下内容:
var id = $(this).parent().attr('id');
window.localStorage.setItem('opened', id);
保存打开的节的ID
。
并将其添加到就绪处理程序:
var opened = window.localStorage.getItem('opened');
if(opened !== ''){
$('#' + opened).find('.content').show();
}
我不知道是应该只打开一个div还是每个opend div,我的解决方案只处理一个打开的div。您确实可以在
localStorage
中存储对扩展元素的引用(或者sessionStorage
可能更合适),并在页面加载时恢复它们的状态:
$(document).ready(function() {
var openTabs = [];
$(".content").hide();
$(".fa-angle-double-up").hide();
$(".heading").click(function(){
var $this = $(this),
selector = '#' + $this.parent().attr('id') + ' .heading';
if ($(this).next('.content').is(':visible'))
{
var pos = openTabs.indexOf(selector);
openTabs.splice(pos, 1);
}
else
openTabs.push(selector);
localStorage.openTabs = openTabs.join(',');
$this.next(".content")
.slideToggle(500)
.find(".fa-angle-double-up, .fa-angle-double-down")
.toggle();
});
if (localStorage.openTabs)
$(localStorage.openTabs).click();
});
另外,请参见