在写js事件时,常常遇到点击一个事件,然后在若干时间以后需要知道最近一次点击的事件的结点。比如这里:

我点击树节点1,再点击tab2,然后我再来回切换tab,假如最后一次点击tab时在tab2上,这时,我希望点击另一个树节点2,但是这时传到后台没有所点tab的标记,自然不会将tab的值传到后台,就算在tab点击事件中设置了标记,在点击树节点时也会被临时销毁了,此时需要做的是点击tab时将值持久化,缓存起来,然后下次刷新的时候用,简单而言,代码就是下面的情况:

1)判断本地存储是否可用:

if(window.localStorage) {  
 // localStorge可用  
 }else {  
// localStorge不可用  
 } 
2)存储数据
[javascript] view plain copy
 print?
// 获取本地存储对象  
var localStorage =window.localStorage;  
// 存储  
localStorage.setItem("key",content);
3)取出数据
[javascript] view plain copy
 print?
var myKey =localStorage.getItem("key"); 
4)
[javascript] view plain copy
 print?
localStorage.clear();
以上是我查看博客http://blog.csdn.net/cordova/article/details/50853452中所显示的代码段,在我自己的项目中我是这样写的:

1)点击tab事件(两个tab事件)实现数据持久化

2)点击树节点时取出持久化数据并判断

3)然后进行对应的数据传值与渲染

4)销毁localStorage(注意,该事件的销毁应该放在事件外面,因为点击一次tab以后可能会多次点击树节点,如果在方法内把持久化的值销毁以后,下一次点击树节点时就会导致取到的值为空)

---------------------
作者:blueskynyl
来源:CSDN
原文:https://blog.csdn.net/qq_33358062/article/details/77100233
版权声明:本文为博主原创文章,转载请附上博文链接!

原 js实现数据持久化的更多相关文章

  1. Can JavaScript connect with MySQL? 浏览器控制台的js采集数据结果持久化存储

    浏览器控制台的js采集数据结果持久化存储 how to open a file in javascript https://developer.mozilla.org/en-US/docs/Web/A ...

  2. 用js把数据从一个页面传到另一个页面

    用js把数据从一个页面传到另一个页面的层里? 如果是传到新页面的话,你网站基于什么语言开发直接用get或者post获取,然后输出到这个层 通过url传参 如果是HTML页面的话JS传到新页面就wind ...

  3. React Native 之 数据持久化

    前言 因为 实战项目系列 涉及到数据持久化,这边就来补充一下. 如本文有错或理解偏差欢迎联系我,会尽快改正更新! 如有什么问题,也可直接通过邮箱 277511806@qq.com 联系我. demo链 ...

  4. dva框架使用mock.js模拟数据 + fetch请求数据

    what DVA? Dva是基于Redux做了一层封装,对于React的state管理,有很多方案,我选择了轻量.简单的Dva. dva 可以很方便就使用mock.js进行数据的模拟. 只需要三步,即 ...

  5. Android开发学习之路--数据持久化之初体验

    上班第一天,虽然工作上处于酱油模式,但是学习上依旧不能拉下,接着学习android开发吧,这里学习数据持久化的 知识. 其实数据持久化就是数据可以保存起来,一般我们保存数据都是以文件,或者数据库的形式 ...

  6. Flutter数据持久化入门以及与Web开发的对比

    对于大部分安卓或者IOS开发人员来说,App的数据持久化可能是很平常的一个话题.但是对于Web开发人员来说,可能紧紧意味着localStorage和sessionStorage. Web开发 loca ...

  7. redis的数据持久化策略

    redis提供了两种不同的持久化方法来将数据存储到硬盘里面.一种方法叫快照,它可以将存在于某一时刻的所有数据都写入硬盘里面.另一种方法叫只追加文件(AOF),它会在执行写命令时,将被执行的写命令复制到 ...

  8. Redis数据持久化

    持久化选项 Redis提供了两种不同的持久化方法来将数据存储到硬盘里面.一种方法叫快照(snapshotting),它可以将存在于某一时刻的所有数据都写入硬盘里面.另一种方法叫只追加文件(append ...

  9. 170320、使用快照和AOF将Redis数据持久化到硬盘中

    前言 我们知道Redis是一款内存服务器,就算我们对自己的服务器足够的信任,不会出现任何软件或者硬件的故障,但也会有可能出现突然断电等情况,造成Redis服务器中的数据失效.因此,我们需要向传统的关系 ...

随机推荐

  1. 第12章 X.509证书库的Fluent API - IdentityModel 中文文档(v1.0.0)

    存储X.509证书的常见位置是Windows X.509证书存储区.商店的原始API有点神秘(在.NET Framework和.NET Core之间也略有变化). X509类是一个简化的API从所述存 ...

  2. DSAPI 网页获取本地程序登陆用户

    这是一个非常简单的示例,在网页或其他平台获取程序中已经登陆的用户,当然也可以是其他信息. 源码 Imports DSAPI.网络.HTTP监听_DSWebAPI Public Class Form1 ...

  3. 设计模式 | 抽象工厂模式(abstract factory)

    定义: 提供一个创建一系列相关或相互依赖对象的接口,而无需指定他们具体的类. 结构:(书中图,侵删) 这个图相对来说有一点点复杂,其实就是在工厂方法模式的基础上做了一些扩展,工厂方法模式只用于生成一种 ...

  4. openlayers4 入门开发系列之船讯篇

    前言 openlayers4 官网的 api 文档介绍地址 openlayers4 api,里面详细的介绍 openlayers4 各个类的介绍,还有就是在线例子:openlayers4 官网在线例子 ...

  5. github常见操作和常见错误!错误提示:fatal: remote origin already exist

    如果输入$ git remote add origin git@github.com:djqiang(github帐号名)/gitdemo(项目名).git 提示出错信息:fatal: remote ...

  6. redis-dump实现redis库迁移

    最近公司有切换redis库的需求,找了个简单的redis迁移方法,不过也有缺点.就是对于实时性要求很高的redis库迁移无法做到数据的实时同步.不过对于简单的redis库备份和迁移还是可以的,各位看官 ...

  7. 一文了解腾讯云数据库SaaS服务

    本文由云+社区发表 作者:邵宗文,2009年加入腾讯,现为腾讯云数据库专家产品经理.之前曾负责为OMG事业群构建数据库平台,部署,规划及运维支持,为腾讯网,新闻客户端,快报,视频,财经,体育等提供了稳 ...

  8. Powershell-查询当前文件目录层级结构

    日常工作中我们往往有需要导出当前共享环境或磁盘文件目录层级结构等的需求,最早在目录少的情况下我们使用CMD下tree 命令可以很清晰的看到目录.文件层级结构,那么我们又如何通过powershell直观 ...

  9. JavaScript中的 NaN 与 isNaN

    NaN NaN 即 Not a Number ,不是一个数字. 在 JavaScript 中,整数和浮点数都统称为 Number 类型 .除此之外,Number 类型还有一个很特殊的值,即 NaN . ...

  10. IM开发者的零基础通信技术入门(一):通信交换技术的百年发展史(上)

    [来源申明]本文原文来自:微信公众号“鲜枣课堂”,官方网站:xzclass.com,原题为:<通信交换的百年沧桑(上)>,本文引用时已征得原作者同意.为了更好的内容呈现,即时通讯网在收录时 ...