0

それらを非表示にするリンクがクリックされた場合、私は複数のdivを非表示にするために単純なコードを使用しています。そのうちの1つには、divが非表示になっているかどうかを覚えておくためのローカルストレージ設定があります。事はこれです。個々のdivごとにlocalstorage.setItemを配置しなくても、ローカルストレージに複数のdivの非表示状態を記憶させるコードを作成するにはどうすればよいですか。div idとその表示がtrueまたはfalseに設定された配列を格納して、ページにそれらを表示するかどうかを決定することは可能ですか？

** * *******編集済み**** ** * ** * ** _ _ _

function ShowHide(id) {
if(document.getElementById(id).style.display = '') {
document.getElementById(id).style.display = 'none';
}
else if (document.getElementById(id).style.display = 'none') {
document.getElementById(id).style.display = ''; 
}
4

1 に答える 1

1

あなたが言ったように、あなたはすでにあなたのすべての状態を保存する配列を持っています。を使用してこれをシリアル化しJSON.stringify()、結果をに入れることができlocalStorageます。

 // your array
 var divstate = [ ... ];

 // store it
 localStorage.setItem( 'divstate', JSON.stringify( divstate ) );

配列を再度取得する場合は、次を使用しますJSON.parse()。

 // restore
 var divstate = JSON.parse( localStorage.getItem( 'divstate' );

編集

すべてのdivの実際のIDを保存するには、おそらく次のようなものを使用します

var divstate = {
  'divid1': true,
  'divid2': false,
  ...
};

これは、上記のパターンで簡単に使用できます。

2回目の編集

上記のコードでは、上記のステートメントを使用して、ページの読み込み時に状態変数を1回読み込むことをお勧めします。

次に、関数を次のように変換します。

function ShowHide(id) {
  var el = document.getElementById(id);

  if ( divstate[id] === true ) {
    divstate[id] = false;
    el.style.display = 'none';
  } else {
    divstate[id] = true;
    el.style.display = '';
  }

  localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
}

このようにdivstateして、関数呼び出しごとにが更新および保存されます。

divの数が多すぎる場合はこれをお勧めしませんが、量が少ない場合はこれで十分です。

于 2012-11-07T16:47:45.117 に答える