点击下拉项后更改下拉按钮的类,并重新加载页面
P粉877719694
P粉877719694 2023-08-17 16:24:17
0
1
439

我试图在用户点击下拉菜单中的项目并重新加载页面后,更改下拉按钮项的类。

以下代码在页面刷新时有效。

$(".dropdown-content").on("click", function() { $('.dropbtn').toggleClass('active'); });

是否有我可以使用的本地存储选项?我刚刚了解到它。

我目前正在使用以下代码来调用出现在下拉按钮中的文本:

$(".dropbtn").text( localStorage.getItem("selected") ? localStorage.getItem("selected") : "Helpful Links" ); $(".dropbtn").on("click", function () { $(".dropdown-content").toggleClass("open"); }); $(".dropdown-content a").on("click", function () { $(".dropbtn").text($(this).text()); localStorage.setItem("selected", $(this).text()); $(".dropdown-content").removeClass("open"); });

非常感谢@RedApple的帮助。它运行良好 - 只是想知道当点击.dropdown-content a项时,是否可以以类似的方式将.dropbtn类设置为active。

我尝试了这个,但我认为我没有正确使用它,因为.dropbtn在页面刷新时没有保留active类:

$(".dropdown-content").on("click", function() { localStorage.setItem("active", $('.dropbtn').toggleClass('active')); $('.dropbtn').toggleClass('active'); });


P粉877719694
P粉877719694

全部回复 (1)
P粉063039990

我认为这应该可以工作...

let isBtnClicked = localStorage.getItem("isBtnClicked") ? localStorage.getItem("isBtnClicked") : false; $(".dropbtn").addClass( isBtnClicked ? "hovered" // 在这里填入您点击按钮的类名 : "" ); $(".dropbtn").text( localStorage.getItem("selected") ? localStorage.getItem("selected") : "Helpful Links" ); $(".dropbtn").on("click", function () { $(".dropdown-content").toggleClass("open"); isBtnClicked = !isBtnClicked; localStorage.setItem("isBtnClicked", isBtnClicked); }); $(".dropdown-content a").on("click", function () { $(".dropbtn").text($(this).text()); localStorage.setItem("selected", $(this).text()); $(".dropdown-content").removeClass("open"); });
    最新下载
    更多>
    网站特效
    网站源码
    网站素材
    前端模板
    关于我们 免责声明 Sitemap
    PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!