gpt4 book ai didi

javascript - 获取 localStorage 并向 div 添加类

转载 作者:行者123 更新时间:2023-12-03 12:45:43 25 4
gpt4 key购买 nike

我有一个很困惑的问题。每次我选中“复选框”时,它都会获取最接近的“div”并添加类“hilight”“marked”并将一个项目设置为名为的LocalStorage “标记”。当我从 div 1 切换到 2 时,我删除了“hilight”类,但保留了“marked”类。

我正在尝试获取 LocalStorage,并再次向具有“标记”的 div 添加“hilight”类

JS fiddle :http://jsfiddle.net/b4KgV/

HTML 1 2

<button class="1st">show 1st</button>
<button class="2nd">show 2nd</button>

JS

localStorage.clear();

$(document).on('click', ':checkbox', function () {
if ($(this).is(':checked')) {
$(this).closest("div").addClass('hilight marked');
localStorage.setItem("marking","yes");
}
else {
$(this).closest("div").removeClass('hilight marked');
}
});

$(".1st").on('click', function() {
$(".second").css('display','none');
$(".second").removeClass('hilight');
$(".first").css('display','block');
});

$(".2nd").on('click', function() {
$(".first").css('display','none');
$(".first").removeClass('hilight');
$(".second").css('display','block');
});

if (localStorage.getItem("marking")) {
$(".marked").closest("div").addClass('hilight');
};

谢谢。

最佳答案

正如你所知,本地存储按键:值存储,我试图将它们分开。试试这个 fiddle

http://jsfiddle.net/b4KgV/11/

$(document).on('click', ':checkbox', function () {
var div = $(this).closest("div").attr("id")
if ($(this).is(':checked')) {
$(this).closest("div").addClass('hilight marked');
localStorage.setItem(div, true);
} else {
$(this).closest("div").removeClass('hilight marked');
localStorage.setItem(div, false);
}
});

$(".1st").on('click', function () {
console.log("test")
if (localStorage.getItem("firstDiv") == "true") {
$(".first").closest("div").addClass('hilight');
};
$(".second").css('display', 'none');
$(".second").removeClass('hilight');
$(".first").css('display', 'block');
});

关于javascript - 获取 localStorage 并向 div 添加类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23352278/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com