保存返回访问的页面状态

我正在构建伴随演示文稿的网站。我被问及网站内容是否可以根据所呈现的内容定制，即删除网页上的一些元素。所以我构建了一个非常简单的脚本，它将隐藏内容并在刷新时重置。保存返回访问的页面状态

我被问过的是如果有一种方式可以提前准备好演示文稿。这里的问题是可能会提前一小时或一天设置，然后浏览器可能会关闭。

我不是在寻找预先登录保存的配置文件等，但是有没有一种方法，网站会记住哪些内容最后显示在屏幕上，并以相同方式重新加载，无论是通过缓存还是理想地使用用户名如电子邮件地址。

HTML

<div id="uber"> 
    <div class="box box1"> 
     <a href="#" class="remove">Remove</a> 
     <h1>Box 1</h1> 
     <p>Objectively simplify dynamic e-business before out-of-the-box channels. </p> 
    </div> 
    <div class="box box2"> 
     <a href="#" class="remove">Remove</a> 
     <h1>Box 2</h1> 
     <p>Compellingly build global human capital rather than magnetic partnerships. </p> 
    </div> 
    <div class="box box3"> 
     <a href="#" class="remove">Remove</a> 
     <h1>Box 3</h1> 
     <p>Holisticly communicate premium technologies rather than 24/7 content. </p> 
    </div> 
    <div class="pageRefresh"> 
     <button>Refresh a Page in jQuery</button> 
    </div> 
</div>

jQuery的

$('.remove').click(function() { 
    $(this).closest('.box').fadeOut("slow", function() { 
     $(this).addClass('is-hidden'); 
    }); 
}); 

$('.pageRefresh').click(function() { 
    $('.box.is-hidden').fadeIn("slow", function() { 
     $(this).removeClass('is-hidden'); 
    }); 
});

CSS

.box { 
    float: left; 
    margin-right: 20px; 
    padding: 10px; 
    width: 20%; 
    background: lightgrey; 
} 

.pageRefresh { 
    clear: both; 
    padding: 20px 0; 
} 

.is-hidden { 
    display: none; 
}

来源

2015-10-27 Darren

可以定义一个严格的格式JSON对象含显示什么信息，如何/在哪里（或其它）以显示它，并将该对象保存在该人的localStorage中。

在页面加载时，您从localStorage中读取此对象，并根据其值取决于您的页面。

来源

2015-10-27 18:18:53

看起来localStorage的可能是最好的一段路要走。我会研究并研究这一点。谢谢。 – Darren

如何在你的url中使用查询字符串？

喜欢的东西：

?hide[]=box1&hide[]=box2

然后分析它的文件准备与这个解决方案之一： How can I get query string values in JavaScript?

来源

2015-10-27 18:23:58

保存返回访问的页面状态

回答

相关问题