将用户的输入保存至localStorage对象的属性中,这些属性在再次访问时还会继续保持在原位置。

如果你在浏览器中按照fil://URL的方式直接打开本地文件,则文法在某些浏览器中使用存储功能(比如FireFox)

而通过HTTP打开文件是可行的。

将用户的输入数据保存下来,这样在下次访问时也能取到数据

  function save(a, b, c, d) {
if (window.localStorage) {//只有在浏览器支持的时候才运行这里的代码
localStorage.loan_a = a;
localStorage.loan_b = b;
localStorage.loan_c = c;
localStorage.loan_d = d;
}
}

保存到localStorage

在文档首次加载时,将会尝试还原输入字段

         window.onload = function () {
//如果浏览器支持本地储存并且上次保存的值是存在的
if (window.localStorage && localStorage.loan_a) {
document.getElementById("a").value = localStorage.loan_a;
document.getElementById("b").value = localStorage.loan_b;
document.getElementById("c").value = localStorage.loan_c;
document.getElementById("d").value = localStorage.loan_d;
}
}

首次加载还原数据

 

保存localStorage并访问的更多相关文章

  1. JS --- 本地保存localStorage、sessionStorage用法总结

    JS的本地保存localStorage.sessionStorage用法总结 localStorage.sessionStorage是Html5的特性,IE7以下浏览器不支持 为什么要掌握localS ...

  2. JS的本地保存localStorage、sessionStorage用法总结

    localStorage 生命周期是永久的  这意味着除非用户显示在浏览器提供的UI上清除localStorage信息,否则这些信息将永远存在. sessionStorage 生命周期为当前窗口或标签 ...

  3. localStorage保存账号密码

    首先是判断浏览器是否支持这一属性,他是HTML5里的属性: if(window.localStorage){ alert('支持');}else{ alert('不支持');} localStorag ...

  4. 利用localStorage实现对ueditor编辑内容定时保存为草稿

    直接看代码吧 1.引入ueditor和ueditor的使用我就不细说了 详情请戳http://blog.csdn.net/wangdianyong/article/details/39780709 2 ...

  5. Cookie, LocalStorage 与 SessionStorage

    Cookie, LocalStorage 与 SessionStorage相同点 都是储存在用户本地的数据. 意义在于避免数据在浏览器和服务器间不必要地来回传递. 三者的特点     同属于html5 ...

  6. 《前端之路》之 Cookie && localStorage && Session Storage 缓存相关

    08: Cookie && localStorage && Session Storage 缓存相关 客户端.前端 存储 一. 起 因 首先解释下为什么想来写这个关于前 ...

  7. 本地存储localStorage以及它的封装接口store.js的使用

    本地存储localStorage以及它的封装接口store.js的使用 sublime-text chrome javascript readyGo 2016年11月20日发布   0 推荐 9 收藏 ...

  8. web本地存储localStorage和sessionStorage

    用谷歌浏览器调试网页程序时候发现有一个这个栏目 记录本地存储的相关信息(cookie,sessionStorage,LocalStorage等)的存储信息 1.LocalStorage localst ...

  9. HTML5 localStorage与document.domain设置问题

    localStorage的写入和读取,不能跨子域,否则在一些移动端浏览器上,会出现读取不到的情况. 最近开发一个移动端的播放记录功能,在pc端和android版的chrome测试很顺利通过了,但后来进 ...

随机推荐

  1. MapReduce in MongoDB

    MongoDB の MapReduce 在Hadoop的学习中已经接触过MapReduce了,它是一个很成熟的计算模型,将大批量的工作(也就是数据)分解(MAP映射)执行,最后将结果合并成最终的Red ...

  2. throw 与 throws的比较

    说实话,今天在公司的实习,确确实实编号被严重打脸了,说真的,自己的基础功不扎实,希望慢慢弥补吧! 抛出异常有三种形式,一是throw,一个throws,还有一种系统自动抛异常,下面它们之间的异同. 一 ...

  3. PHP学习(1)

  4. UESTC 1324:卿学姐与公主(分块)

    http://acm.uestc.edu.cn/#/problem/show/1324 题意:…… 思路:卿学姐的学习分块例题. 分块是在线处理区间问题的类暴力算法,复杂度O(n*sqrt(n)),把 ...

  5. Innovus教程 - Flow系列 - MMMC分析环境的配置概述(理论+实践+命令)

    本文转自:自己的微信公众号<集成电路设计及EDA教程> <Innovus教程 - Flow系列 - MMMC分析环境的配置概述(理论+实践+命令)>   轻轻走过,悄悄看过,无 ...

  6. SQL Server 触发器和事务

    一.触发器 1. 定义 --基本语法 create trigger Trigger_Name on TableName for type --type:insert,update,delete as ...

  7. 十代雅阁广东车友群,雅阁广州车友群,深圳雅阁车友群,雅阁微信群、雅阁车友群、十代雅阁交流微信QQ群

    最近一直在关注第十代雅阁,不论是普通汽油版本还是油电混动版本都很不错,在网上看到很多评测文章和视频 后续都会整理发布到微信群中. 由于论坛发帖,博客发文都不是很方便,为了及时沟通,先创建了微信群,方便 ...

  8. CDQZ集训DAY4 日记

    早上起来之后发现座位被zzh占了,得知座位改为先来后到,什么鬼…… 于是去了另一个有耳机的机房,然而并没有什么卵用. T1上来感觉很有意思,先切50分再说.T2好像是原题的说,切了原题30分后大胆猜测 ...

  9. springboot 整合mybatis,pagehelper。测试类。

    报名立减200元.暑假直降6888. 遇到的异常. 1.这是在使用mybatis成功连接数据库后,通过service层调用dao层出现的异常. 异常原因:在启动类上面的注解@MapperScan没有指 ...

  10. sql server编写通用脚本实现获取一年前日期的方法

    问题: 在数据库编程开发中,有时需要获取一年前的日期,以便以此为时间的分界点,查询其前后对应的数据量.例如:1. 想查询截止到一年前当天0点之前的数据量,以及一年前当天0点开始到现在的数据量.2. 想 ...