드롭다운 항목을 클릭한 후 드롭다운 버튼의 클래스를 변경하고 페이지를 새로고침하세요.

Question

사용자가 드롭다운 메뉴의 항목을 클릭하고 페이지를 다시 로드한 후 드롭다운 버튼 항목의 클래스를 변경하려고 합니다.

다음 코드는 페이지를 새로 고칠 때 유효합니다.

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

사용할 수 있는 로컬 저장소 옵션이 있나요? 방금 그것에 대해 배웠습니다.

현재 다음 코드를 사용하여 드롭다운 버튼에 나타나는 텍스트를 호출하고 있습니다.

$(".dropbtn").text(
localStorage.getItem("선택됨")
? localStorage.getItem("선택됨")
: "도움이 되는 링크"
);
$(".dropbtn").on("클릭", 함수 () {
$(".dropdown-content").toggleClass("열기");
});
$(".dropdown-content a").on("클릭", 함수 () {
$(".dropbtn").text($(this).text());
localStorage.setItem("selected", $(this).text());
$(".dropdown-content").removeClass("열기");
});

도움을 주신 @RedApple에게 깊은 감사를 드립니다. 잘 작동합니다. .dropdown-content a 항목을 클릭할 때 .dropbtn 클래스가 비슷한 방식으로 활성화되도록 설정할 수 있는지 궁금합니다.

이것을 시도했지만 .dropbtn이 페이지 새로 고침 시 활성 클래스를 유지하지 않기 때문에 올바르게 사용하지 않는 것 같습니다.

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

Answer 1

이게 효과가 있을 것 같아요...

으아악