61

我想要做的是能够创建一个变量,给它一个值,关闭并重新打开窗口,并能够检索我在上次会话中设置的值。最简单的方法是什么?欢迎使用 JQuery 回答。

4

5 回答 5

105

为此使用localStorage。它在会话中持续存在。

写作 :

localStorage['myKey'] = 'somestring'; // only strings

阅读 :

var myVar = localStorage['myKey'] || 'defaultValue';

如果您需要存储复杂的结构,您可以将它们序列化为 JSON。例如 :

阅读 :

var stored = localStorage['myKey'];
if (stored) myVar = JSON.parse(stored);
else myVar = {a:'test', b: [1, 2, 3]};

写作 :

localStorage['myKey'] = JSON.stringify(myVar);

请注意,您可以使用多个密钥。它们都将被同一域上的所有页面检索。

除非您想与 IE7 兼容,否则您没有理由使用过时的小型 cookie。

于 2013-01-10T20:32:30.403 回答
14

你有三个选择:

  1. 饼干:https ://developer.mozilla.org/en-US/docs/DOM/document.cookie
  2. DOMStorage(sessionStorage 或 localStorage):https ://developer.mozilla.org/en-US/docs/DOM/Storage
  3. 如果您的用户已登录,您可以将数据保存在服务器的数据库中,这些数据键入用户(或组)
于 2013-01-10T20:36:59.713 回答
10

如果您的要求允许,您可以创建一个 cookie。如果您选择采用 cookie 路由,则解决方案可能如下。使用 cookie 的好处是在用户关闭浏览器并重新打开后,如果 cookie 没有被删除,则该值将被保留。

Cookie *创建和存储 Cookie: *

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

返回指定cookie的函数:

function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

如果设置了 cookie,则显示欢迎消息

function checkCookie()
{
var username=getCookie("username");
  if (username!=null && username!="")
  {
  alert("Welcome again " + username);
  }
else 
  {
  username=prompt("Please enter your name:","");
  if (username!=null && username!="")
    {
    setCookie("username",username,365);
    }
  }
}

上述解决方案是通过 cookie 保存价值。这是一种非常标准的方式,无需将值存储在服务器端。

jQuery

为会话存储设置一个值。

Javascript:

$.sessionStorage( 'foo', {data:'bar'} );

检索值:

$.sessionStorage( 'foo', {data:'bar'} );

$.sessionStorage( 'foo' );Results:
{data:'bar'}

本地存储 现在让我们看看本地存储。例如,假设您有一组要保留的变量。您可以执行以下操作:

var names=[];
names[0]=prompt("New name?");
localStorage['names']=JSON.stringify(names);

//...
var storedNames=JSON.parse(localStorage['names']);

使用 ASP.NET 的服务器端示例

添加到会话

Session["FirstName"] = FirstNameTextBox.Text;
Session["LastName"] = LastNameTextBox.Text;

// 从会话状态中检索对象时,将其转换为 // 适当的类型。

ArrayList stockPicks = (ArrayList)Session["StockPicks"];

// Write the modified stock picks list back to session state.
Session["StockPicks"] = stockPicks;

我希望这回答了你的问题。

于 2013-01-10T20:37:34.347 回答
3

查看我的 js 库进行缓存: https ://github.com/hoangnd25/cacheJS

我的博文: 使用 Javascript 缓存数据的新方法

特征:

  • 方便地使用数组作为键来保存缓存
  • 支持数组和本地存储
  • 按上下文清除缓存(清除所有带有 authorId="abc" 的博客文章)
  • 无依赖

基本用法:

保存缓存:

cacheJS.set({blogId:1,type:'view'},'<h1>Blog 1</h1>');
cacheJS.set({blogId:2,type:'view'},'<h1>Blog 2</h1>', null, {author:'hoangnd'});
cacheJS.set({blogId:3,type:'view'},'<h1>Blog 3</h1>', 3600, {author:'hoangnd',categoryId:2});

检索缓存:

cacheJS.get({blogId: 1,type: 'view'});

刷新缓存

cacheJS.removeByKey({blogId: 1,type: 'view'});
cacheJS.removeByKey({blogId: 2,type: 'view'});

cacheJS.removeByContext({author:'hoangnd'});

切换供应商

cacheJS.use('array');
cacheJS.use('array').set({blogId:1},'<h1>Blog 1</h1>')};
于 2015-01-11T05:04:08.010 回答
2

我写了一个通用的caching func(),它可以很容易地缓存任何变量并且非常易读的格式。 缓存功能:

function calculateSomethingMaybe(args){
  return args;
}

function caching(fn){
  const cache = {};
  return function(){
    const string = arguments[0];
    if(!cache[string]){
      const result = fn.apply(this, arguments);
      cache[string] = result;
      return result;
    }
    return cache[string];
  }
}

const letsCache = caching(calculateSomethingMaybe);

console.log(letsCache('a book'), letsCache('a pen'), letsCache('a book'));
于 2020-01-25T12:55:06.747 回答