ブラウザのストレージにtreeviewメニューの状態を保存します。

Question

私はjavascriptを使用して構築されたhtmlページを持っています。今、私はどのツリービューが開かれているかを "覚えて"いるページを望みます。メニューが閉じられると、 'testclosed'クラスがdivに追加されます。

シナリオ：ユーザーがメニューを開き、ボタンをクリックしてタスクを完了します。この後、ユーザーはこのページに戻って、すべてが正しく満たされているかどうかを確認する必要があります。ユーザは再び彼のアイテムを見つけなければならない。したがって、ページを出たときに開いていたアイテムをブラウザに記憶させたい

答えの一部がthisですでに見つかりました。確認できないような唯一の問題はチェックを行う方法です私は、ブラウザのストレージ

EDITに保存することができるように：ここでは任意の助けをいただければ幸いメニュー（オープンとクローズ）

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

をトグルコードです。ありがとうございます

Answer 1

コードを見ずに関連する例を作るのは難しいです。あなたがページをロードしたら、それを確認した後、開いたメニューのクラス名を格納するlocalStorage APIを使用することができます。

// 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については、こちらをご覧ください。

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"); 

    } 

}