JQuery persistent toggle div

Question

私はJavascriptを初めて使い、永続的なトグルで苦労しています。

ここで概要を説明しているコードを変更しようとしていますToggle DIV state localstorage ローカルストレージ変数が定義されていません。

HTML

<div class="oo-adv-search"> 
    <a id='hideshow' value='hide/show'>advanced search</a> 
</div> 
<div id="adv_search" class="oo-adv-search-box"> 
    search box content 
</div> 

CSS

.oo-adv-search { 
    font-size: 12px; 
    font-family: 'Roboto'; 
    width: 200px; 
    font-weight: 300; 
    color: #000; 
    cursor: pointer; 
    text-align: left; 
    padding: 0px; 
} 

.oo-adv-search-box { 
    display:none; 
} 

JScriptの

$(document).ready(function(){ 
    var opened = window.localStorage.getItem('opened'); 

    $('.oo-adv-search-box').hide(); 
     if(opened !== ''){ 
      $('#' + opened).find('.oo-adv-search-box').show(); 
     } 

    $('.oo-adv-search').on('click', function(event) { 
     $(this).next(".oo-adv-search-box").slideToggle(500); 
     var id = $(this).parent().attr('id'); 
     window.localStorage.setItem('opened', id); 
    }); 
}); 

ここに私のjsfiddleです：https://jsfiddle.net/woodbine/0krzr949/

Answer 1

私はあなたのフィドルを見ていると私はあなたが単純にしたい理解してt高度な検索divのoggle可視性、これのためのlocalStorageにフラグを設定する必要はありません、要素が表示されているかどうかを確認してください。

$("#hideshow").on('click',function() { 
    if($("#adv_search").is(":visible")) { // hide div if visible 
     $("#adv_search").hide(); 
    } else { 
     $("#adv_search").show(); // if not visible show 
    } 
}); 

Fiddle