同じことを続けるページを変更するとdivを表示/非表示にする

Question

メインページの機能を使用しています。すべてが正常に動作し、私はちょうど機能を使用する方法を知りたい：

localStorage.setItem("language", selectedLanguage); 

currentlanguage= localStorage.getItem("language"); 

私の目標は、私がリンクをクリックすると別のページに行くときにページで選択した言語を維持することです。

たとえば、id = "en"はデフォルトで言語ですが、メインページでid = "fr"を使用したい場合は、リンクをクリックして別のページで私を送信します。 id = "en"に戻ってきます。だから私は同じ言語を維持するためにlocalStorageを使うことができますか？ここで

は、私が使う機能のjsfiddleです：HERE

https://jsfiddle.net/kodjoe/chvw181j/ 

はMY HTMLコードが

IS

<a class="button" id="en">EN</a> 
<a class="button" id="fr">FR</a> 
<a class="button" id="de">DE</a> 


<div class="lan en">1</div> 
<div class="lan fr">2</div> 
<div class="lan de">3</div> 
<div class="lan en">4</div> 
<div class="lan fr">5</div> 
<div class="lan de">6</div> 

HERE HERE

$(document).ready(function() { 
$('.lan').hide(); 
$('.en').show(); 
}); 

$('.button').click(function(event) { 
$('.lan').hide(); 
var selectedLanguage = $(this).attr('id'); 
var setActiveLanguage = "." + selectedLanguage; 
$(setActiveLanguage).show(); 

localStorage.setItem("language", selectedLanguage); 
currentlanguage= localStorage.getItem("language"); 
}); 

はMY CSS IS MY JS IS

.button { cursor:pointer; padding: 0px 30px; } 

Answer 1

localStorage.setItem("language", selectedLanguage); 

currentlanguage= localStorage.getItem("language"); 

Answer 2

SessionStorageを使用して、選択した言語などのデータを保存できます。 if-clauseで関数を使い、正しいshow/hide-statusを設定します。

Answer 3

あなたがまたはすでになどのアプリケーションに適用可能な他のスクリプトを持っているでしょうから、あなたがのlocalStorageを使用することができますが、私はちょうどあなたが任意のグローバル・スクリプトを含めたいファイルにコードを置きます全体。次に、あなたの頭の中のファイルをリンクします（あなたのヘッダーの内容にインクルードを使用している可能性があります）。

<script src="js/globalScripts.js"></script>

//globalScripts.js 

$(document).ready(function() { 
    $('.lan').hide(); 
    $('.en').show(); 
}); 

$('.button').click(function(event) { 
    $('.lan').hide(); 
    var selectedLanguage = $(this).attr('id'); 
    var setActiveLanguage = "." + selectedLanguage; 
    $(setActiveLanguage).show(); 
});