javascript - ページの更新/変更後にアイテムをオフに切り替えたままにする

Question

ユーザーが別のページに移動した後、またはページを更新した後、divを非表示にするにはどうすればよいですか？フッターに次のコードがあるので、すべてのページに読み込まれます。

$(document).ready(function() {
 $('#clickmebottom').click(function() {
      $('#bottomfixtab').animate({
           height: 'toggle'
           }, 350
      );
 });
});

#clickmebottomは、クリックすると#bottomfixtab div（画面下部の小さな固定バナー）を非表示にするXボタンです。

助けてくれてありがとう

Answer 1

jquery-cookieなどのjQueryプラグインを使用して、Cookieアクセスを簡素化できます。したがって、divのトグル設定を保存するためのコードは次のようになります。

// pseudo-code, you'll want to check the actual syntax
$(document).ready(function() {

  // see if the cookie is set, if it is, hide the div
  if ( $.cookie('toggledDiv' ) {
    $('#bottomfixtab').hide();
  }
  $('#clickmebottom').click(function() {
    $.cookie('toggledDiv');
    $('#bottomfixtab').animate({
      height: 'toggle'
    }, 350 );
  });
});

これにより、おそらくdivがフラッシュされてから非表示になるため、そのフラッシュを回避する場合は、デフォルトをdisplay：noneに設定し、Cookieが設定されていない場合は、divを表示します。

// again, pseduo-code
if ( !$.cookie('toggledDiv') ) {
  $('#bottomfixtab').show()
}