私はJavascriptを初めて使い、永続的なトグルで苦労しています。JQuery persistent toggle div
ここで概要を説明しているコードを変更しようとしています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/
あなたは 'あなたのフィドルでjquery'ファイルを含めるのを忘れていました。 – Bhumika107
jQueryを組み込んでおらず、 '$(this).parent()。attr( 'id')'を使って存在しない要素に移動しているので、 'this'はあなたのHTMLサンプルに親を持たない' .oo-adv-search'です。したがって、 'id'は常に未定義です。 –
お詫び申し上げます。 jQueryが追加されました。 – woodbine