如何将事件绑定到会话存储
How do I bind event to sessionStorage?
我可以成功地将更改的事件绑定到localStorage(使用jquery):
$(window).bind('storage', function(e)
{
alert('change');
});
localStorage.setItem('someItem', 'someValue');
如果我使用 sessionStorage,该事件将不会触发:
$(window).bind('storage', function(e)
{
alert('change');
});
sessionStorage.setItem('someItem', 'someValue');
这是为什么呢?
每个选项卡的sessionStorage
都是隔离的,因此它们无法通信。sessionStorage
的事件仅在同一选项卡上的帧之间触发。
编辑:
我做了以下示例:
http://codepen.io/surdu/pen/QGZGLO?editors=1010
示例页面有两个按钮,用于触发本地和会话存储更改。
它还将 iframe 嵌入到另一个侦听存储事件更改的代码笔中:
http://codepen.io/surdu/pen/GNYNrW?editors=1010(您应该在不同的选项卡中打开它。
您会注意到,当您按下"写入本地"按钮时,在 iframe 和打开的选项卡中都会捕获事件,但是当您按下"会话写入"时,只有嵌入的 iframe 会捕获事件。
我认为这就是它的意义所在。从规范(强调添加):
clear()
removeItem()
setItem()
当在Storage
与会话存储区域关联的对象 x,如果 这些方法做了一些事情,然后在每个 Document 对象中 窗口 对象的会话存储属性的存储对象与 除 X 之外的同一存储区域,必须触发存储事件
我认为这意味着该事件将在共享会话存储对象的任何其他文档中触发,而不是导致事件触发的文档。
更新
这是另一个非常相似的问题,似乎与我上面提到的一致(答案引用了规范中的同一段落)。
这个问题似乎得到了相当多的浏览量,所以我只是将其作为额外信息发布。
如果要专门响应会话存储对象上的更新,则可以忽略由 localStorage 引起的事件:
$(window).on('storage',function(e){
if(e.originalEvent.storageArea===sessionStorage){
alert('change');
}
// else, event is caused by an update to localStorage, ignore it
});
我讨厌jQuery,所以也会发布一个原生版本:
window.addEventListener('storage',function(e){
if(e.storageArea===sessionStorage){
alert('change');
}
// else, event is caused by an update to localStorage, ignore it
});
- '会话'未定义-会话存储的Este JS/Express/Redis
- 当会话存储阵列中存在大量元素时,如何从中删除元素
- C#/Javascript会话存储
- Javascript 会话存储变量未正确保存
- 不会删除会话存储
- 如何改进此会话存储命名系统/for循环
- 会话存储何时实际清除
- 浏览器会话存储.在选项卡之间共享
- 会话存储:如何存储多个对象
- 在Polymer中使用会话存储web中的数据
- 会话存储安全性
- 尝试使用会话存储;无法设置属性'登录'的未定义引用或null引用
- 会话存储
- 如何使用java脚本更改浏览器的内存管理以增加会话存储和本地存储的内存
- 使用 JSP 设置 HTML5 会话存储<键,值>
- 测试本地存储/会话存储最大数据量
- 我可以将整个标签存储到会话存储中吗?
- 会话存储未保存或未加载
- 如何在 Servlet 中将对象从会话存储到 List
- 是否有跨子域工作的现代会话存储替代方案