应用场景:将登录接口所返回的用户信息存入sessionStorage,在其他地方需要使用到用户信息,但不知道什么时候接口请求完,此时可以监听sessionStorage中值的变化。

应用:Event自定义事件 window.dispatchEvent();事件分发

var orignalSetItem = sessionStorage.setItem;
sessionStorage.setItem = function(key, newValue) {
var setItemEvent = new Event("setItemEvent");
setItemEvent.newValue = newValue;
window.dispatchEvent(setItemEvent);
orignalSetItem.apply(this, arguments);
};
// 获取sessionStorage中需要监听的值loginInfor
var info = sessionStorage.getItem("loginInfor");
if (info) { // 符合条件
console.log(info);
} else {
// 否则继续监听
window.addEventListener("setItemEvent", function(e) {
if ((e.key = "loginInfor")) {
var _this = sessionStorage.getItem("loginInfor");
if (_this != e.newValue) {
if (e.newValue) {
console.log(e.newValue);
console.log(_this);
}
}
}
});
}

监听sessionStorage中值的变化的更多相关文章

  1. js实时监听input中值的变化

    $(function(){ $('#inputid').bind('input propertychange', function() { // input 中的值 var params = $(th ...

  2. js 实时监听input中值变化

    注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...

  3. vue中父组件如何监听子组件值的变化

    vue中我们会遇到很多父子组件通信的需求, 下面简单列一下,父子组件通信的几种情况 1:父组件向子组件传值:使用prop向子组件传值: 2:子组件实时监听父组件传来的值的变化:使用watch去监听父组 ...

  4. 怎样监听xhr.readyState值的变化

    可以使用 xhr.onreadystatechange 属性指向的函数去监听 xhr.readyState 值的变化. 示例如下: var xhr = new XMLHttpRequest(); xh ...

  5. iOS: 使用KVO监听控制器中数组的变化

    一.介绍: KVO是一种能动态监听到属性值的改变的方式,使用场景非常广泛,这里我只讲如何监听控制器ViewController中数组的变化. 二.了解: 首先我们应该知道KVO是不能直接监听控制器Vi ...

  6. 黎活明8天快速掌握android视频教程--21_监听ContentProvider中数据的变化

    采用ContentProvider除了可以让其他应用访问当前的app的数据之外,还有可以实现当app的数据发送变化的时候,通知注册了数据变化通知的调用者 其他所有的代码都和第20讲的一样,不同的地方看 ...

  7. 监听localStorage中的数据变化

    问题描述:我们在js里面获取了某一个localstorage的值,但是后期它可能改变了,我们js只执行一遍没办法再次获取它的值,当然可以刷新页面获取,但如果是我们的但页面就不能刷新页面了,此时:我们可 ...

  8. js监听文本框值变化事件,就oninput & onpropertychange & onkeyup & onchange的区别

    在Web前端项目中实时监听文本框的值变化是非常常见的功能,通常最简单最容易想到的是onkeyup和onchange事件,但是在使用onkeyup来监听键盘事件的时候,监听不到鼠标右键的粘贴.复制的操作 ...

  9. js监听input输入框值的实时变化实例

    情景:监听input输入框值的实时变化实例 解决方法:1.在元素上同时绑定oninput和onporpertychanger事件 实例:<script type="text/JavaS ...

  10. jQuery实时监听input的值变化(input的值产生变化才会触发事件)

    //用于监听input的值变化(input的值产生变化才会触发事件) (function ($) { $.fn.watch = function (callback) { return this.ea ...

随机推荐

  1. nginx配置高可用的集群

    上图: (1)需要两台 nginx 服务器 (2)需要 keepalived (3)需要虚拟 ip 准备工作 配置高可用的准备工作 (1)需要两台服务器,两个Linux虚拟机即可,这里是 192.16 ...

  2. Webstorm 2024 安装使用 (附加永久激活码、补丁)

    下载安装 第二步,安装完成之后,下载补丁 下载地址(里面包含激活码) 完成,之后输入激活码 免责声明:本文中的资源均来自互联网,仅供个人学习和交流使用,严禁用于商业行为,下载后请在24小时内从电脑中彻 ...

  3. spring基础配置原则

    spring框架本身有四大原则:1.使用pojo进行轻量级和最小侵入式开发2.通过依赖注入和基于接口编程实现松耦合3.通过AOP和默认习惯进行声明式编程4.使用AOP和模板减少模式化代码spring ...

  4. 计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session

    文章目录 一.HTTP协议的特点 1.1 特点 1.2 HTTP是不保存状态的协议,如何保存用户状态? 二.浏览器中输入URL返回页面过程(重) 三.HTTP状态码 四.HTTP相关协议对比 4.1 ...

  5. 9-5 额外的string操作

    9.5.1 构造string的其他方法:略 9.5.2 改变string的其他方法:略 9.5.3 string搜索操作:略 9.5.4 compare函数:略 9.5.5 数值转换 int main ...

  6. 使用Roslyn的源生成器生成DTO

    前言 源生成器的好处很多, 通过在编译时生成代码,可以减少运行时的反射和动态代码生成,从而提高应用程序的性能, 有时候需要对程序AOT以及裁剪编译的dll也是需要用SG来处理的. 我们开发程序应该都绕 ...

  7. Visual Studio 存在版本之间冲突

    1 . 检查项目中有没有重复引用的包,如果有的话卸掉一个. 2.. 检查项目中引用的包是否自带所重复的包,这样会导致项目之间引发包冲突. 举个例子: 我的项目里ICSharpCode.SharpZip ...

  8. 软件项目技术点(12)——绘制生成的图表到canvas

    AxeSlide软件项目梳理   canvas绘图系列知识点整理 插入图表 首先介绍我们的图表功能,点击插入图表弹出如下数据表格窗口,可以填写表格数据,点击确定,默认生成表格图 编辑图表 表格图选中, ...

  9. 强网杯2023 谍影重重3.0 wp

    参考文章:[使用主动探测方法识别 U2hhZG93c29ja3M=(base64) 服务 - Phuker's Blog]:https://phuker.github.io/posts/U2hhZG9 ...

  10. 0. RyuJIT Tutorials - RyuJIT 的历史和架构

    目录 上一篇:无 下一篇:待更新 正文 RyuJIT - 即 .NET 的 JIT 编译器,负责将 IL 代码编译为最终用于执行的机器代码. 本系列为 RyuJIT 教程,将分为多篇进行更新发布,旨在 ...