브라우저 저장 영역에 treeview 메뉴의 상태 저장

Question

자바 스크립트를 사용하여 빌드 된 html 페이지가 있습니다. 이제 나는 어떤 treeview가 열렸는지를 기억하는 페이지를 원한다. 메뉴가 닫히면 'testclosed'클래스가 div에 추가됩니다.

시나리오 : 사용자가 메뉴를 열고 단추를 클릭하여 작업을 완료합니다. 이 후 사용자는이 페이지로 돌아와 모든 것이 제대로 채워 졌는지 확인해야합니다. 그런 다음 사용자는 자신의 항목을 다시 찾아야합니다. 따라서 브라우저에서 페이지를 떠날 때 열려 있던 항목을 기억하길 원합니다.

this 질문에서 이미 답변을 찾았습니다. 찾을 수없는 유일한 방법은 확인 방법입니다. 내가 브라우저 저장

편집에 저장할 수 있도록 다음은 메뉴 전환 (개방 및 폐쇄) 코드

$('.testlevel2').click(function() { 
    var group = $(this).attr('group'); 
    var groupval = $(this).attr('groupvalue'); 
    $("div").find("[" + group + "='" + groupval + "']").toggleClass("testclosed"); 
}); 
return "</div>"; 

어떤 도움을 주시면 감사하겠습니다이다. 고맙습니다.

Answer 1

코드를 보지 않고 관련 예제를 만드는 것은 어렵습니다.

// Call this when you open and close a menu 
function saveSettings(openMenuClassName) { 
    // Store value in localStorage 
    localStorage.setItem('openMenu', openMenuClassName) 
} 

function loadSettings() { 
    // Get value from localStorage 
    var openMenu = localStorage.getItem('openMenu'); 
    if (openMenu) $(openMenu).show(); 
} 

// Check for the saved setting on page ready 
$(document).ready(loadSettings); 

등에 대한 localStoragehere 읽기 : 페이지를로드 후에는 다음을 확인 열린 메뉴 클래스 이름을 저장하기 위해 localStorage API를 사용할 수 있습니다.

Answer 2

시안은 올바른 생각을 갖고 올바른 길로 나를 설정했습니다. 이것은 내가 결국 생각해 낸 대답입니다.

"testclosed"클래스는 항목을 닫을 때 추가됩니다. 이것은 이미 질문에서와 마찬가지입니다.

아래 save() 함수에서 수행 한 작업은 클래스가 발견되면 localStorage를 true로 설정합니다.

load() 함수에서 localStorage 항목을 가져오고 true로 설정하면 "testclosed"클래스가 제거됩니다.

$(document).ready(load); 



function save() { 
    var saveDiv = document.getElementsByClassName("testclosed"); 
    if (saveDiv) { 

     localStorage.setItem("isMenuOpen", true); 

    } 

} 

function load() { 
    var isMenuOpen = localStorage.getItem("isMenuOpen"); 
    if (isMenuOpen) { 

     $(".testitem").removeClass("testclosed"); 

    } 

}