戻るボタンを押したときのlocalStorageパラメータは未定義です

Question

私は3ページあります。

1. カテゴリページ - 映画カテゴリのリストを表示します。ホラー、ロマンス、スリラー。
2. 作品リスト - 選択したカテゴリに基づいて映画のリストを取得し
3. 作品詳細は - 映画は、「カテゴリー・ページ」から「ムービー一覧」から、映画のリスト

から選択されたときに、ムービーの詳細情報を取得し、I clickイベントを聞き、ページを「ムービーリスト」に変更する前にカテゴリIDをlocalStorageに格納します。 「ムービー詳細」の「ムービー一覧」から

$(document).on('click', 'a', function(event, ui) { 
    var data_id = $(this).attr('id'); 
    // store some data 
    if (typeof(Storage) !== "undefined") { 
    localStorage.category = data_id; 
    } 
    // Change page 
    $.mobile.changePage("#movelist"); 
}); 

、私は「詳細を移動」するのlocalStorageと変更ページに動画IDを追加します。

$(document).on('click', 'li', function() { 
    if (typeof(Storage) !== "undefined") { 
    localStorage.movie_id= $(this).attr("id"); 
    console.log(localStorage.category); 
    } 
    $.mobile.changePage("#movie-details"); 
}); 

私が直面しています問題は、戻るボタンが「ムービー詳細」ページから押されたときのlocalStorageでカテゴリIDが「未定義」になるので、「ムービー一覧」ページが空であることです。

$(document).on('pagebeforeshow', '#movielist', function() { 
    //empty list to prevent duplicates 
    $('#movie-list').empty(); 
    //get attractions JSON and populate list based on category 
    $.getJSON("./json/movielist.json", function(data) { 
    $.each(data, function(key, val) { 
     if (val.category == localStorage.category) { 
     $('#movie-list').append("<li id='" + val.id + "' class='ui-li-has-thumb ui-first-child'><a class='ui-btn ui-btn-icon-right ui-icon-carat-r'><img src='" + val.image + 
           "' class='thumbnail'/><h2>" + 
           val.name + "</h2></a></li>"); 
     } 
    }); 
    }); 
}); 

質問1：戻るボタンを押すとlocalStorageデータはクリアされますか？どうして？

質問2：Movielistがまだロードされるようにカテゴリを保持することを確認するにはどうすればよいですか？

すべてのヘルプを評価してください。ありがとう。

Answer 1

$(document).on('click', 'a', function(event, ui) { 
    var data_id = $(this).attr('id'); 
    // store some data 
    if (typeof(Storage) !== "undefined") { 
     localStorage.setItem('category', data_id); 
    } 
    // Change page 
    $.mobile.changePage("#movelist"); 
}); 
$(document).on('click', 'li', function() { 
    if (typeof(Storage) !== "undefined") { 
     localStorage.setItem('movie_id', $(this).attr("id")); 
     console.log(localStorage.getItem('category')); 
    } 
    $.mobile.changePage("#movie-details"); 
}); 
$(document).on('pagebeforeshow', '#movielist', function() { 
    //empty list to prevent duplicates 
    $('#movie-list').empty(); 
    //get attractions JSON and populate list based on category 
    $.getJSON("./json/movielist.json", function(data) { 
     $.each(data, function(key, val) { 
      if (val.category == localStorage.getItem('category')) { 
       $('#movie-list').append("<li id='" + val.id + "' class='ui-li-has-thumb ui-first-child'><a class='ui-btn ui-btn-icon-right ui-icon-carat-r'><img src='" + val.image + 
         "' class='thumbnail'/><h2>" + 
         val.name + "</h2></a></li>"); 
      } 
     }); 
    }); 
}); 

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage