Question

我目前正在开发一个小型界面，我使用一个非常简单的show and hide脚本。

    $(document).ready(function(){
      $("#hide").click(function(){
        $(".advanced").hide();
        $(".basic").show();
      });
      $("#show").click(function(){
        $(".advanced").show();
        $(".basic").hide();
      });
    });

它的目的是隐藏和显示导航中的某个元素（基本和高级视图可以这么说）。我现在的问题是如何将它与cookie插件结合起来？我希望保留偏好保存，而不是总是跳回到＆＃34;基本＆＃34;查看我是否更改为其他页面。

非常感谢，丹尼尔

Answer 1

请你看一下LocalStorage（德语，找不到一些英文）

以下是英语中的一些LocalStorage EN

（因为不是所有人都允许吵闹声）

您可以存储

等数据

localStorage.setItem("key", "value");

localStorage.getItem("key");

Working Fiddle（你可以这样做的方式）

$(document).ready(function () {

    $(".advanced").css('display', localStorage.getItem('advanced'));
    $(".basic").css('display', localStorage.getItem('basic'));

    $("#hide").click(function () {
        $(".advanced").hide();
        $(".basic").show();
        localStorage.setItem('advanced', 'none');
        localStorage.setItem('basic', 'block');
    });

    $("#show").click(function () {
        $(".advanced").show();
        $(".basic").hide();
        localStorage.setItem('advanced', 'block');
        localStorage.setItem('basic', 'none');
    });
});

Answer 2

使用JQuery's COOKIE plugin：

$(document).ready(function(){
    if ($.cookie("state") == "hide") {
        $("#hide").click();
    } else {
        $("#show").click();
    }
    $("#hide").click(function(){
        $.cookie("state", "hide");
        $(".advanced").hide();
        $(".basic").show();
    });
    $("#show").click(function(){
        $.cookie("state", "show");
        $(".advanced").show();
        $(".basic").hide();
    });
});

Answer 3

$(document).ready(function(){
  if($.cookie("show")==1){
    $(".advanced").show();
    $(".basic").hide();
  } else{
    $(".advanced").hide();
    $(".basic").show();
  }
  $("#hide").click(function(){
    $(".advanced").hide();
    $(".basic").show();
    $.cookie("show", 0);
  });
  $("#show").click(function(){
    $(".advanced").show();
    $(".basic").hide();
    $.cookie("show", 1);
  });
});

show hide脚本的jquery cookie

3 个答案: