使用LocalStorage存储用户已填写的表单信息(意外刷新后自动填充)

简介: 使用LocalStorage存储用户已填写的表单信息(意外刷新后自动填充)

使用LocalStorage存储用户已填写的表单信息(意外刷新后自动填充)


先引入一个js文件:sisyphus.min.js


(官网:http://sisyphus-js.herokuapp.com/


在页面的script中找个地方引用:


$( function() {
  $( "#basic_form" ).sisyphus();
  // or you can persist all forms data at one command
  // $( "form" ).sisyphus();
} );


备注:


1、我只用于存储form表单数据,至于其他的可以到官网去拜读下


2、用户提交表单之后记得清除localStorage里中的表单数据,因为sisyphus是将用户所填写的数据保存到localStorage的存储的格式为:key:  [id=form的id][name=undefined][id=标签的id][name=标签的name]


value:用户所填的数据


3、提交成功之后,清除localStorage:localStorage.clear();


4、不支持标签中onchange()调用的方法


20181211182045244.png


最简单的示例:http://www.jq22.com/jquery-info268

目录
相关文章
|
14天前
|
数据采集 Web App开发 JavaScript
如何在Puppeteer中实现表单自动填写与提交:问卷调查
本文介绍了如何使用 Puppeteer 和代理 IP 技术实现在线问卷调查的自动填写与提交。Puppeteer 是一个基于 Node.js 的无头浏览器自动化库,能够模拟用户行为,填写表单并提交数据。通过配置代理 IP,可以提高匿名性和爬取效率,避免因频繁请求而被封禁。本文提供了详细的代码示例和技术分析,帮助读者理解和应用这一技术。
|
6月前
如何在二维码中自动填充上次填写过的内容?
【自动填充上次填写的内容】功能能够提升填表效率,开启后,填表人在第二次打开该表单时,系统会默认显示他第一次填写的信息,减少反复填写的工作量。
公开访问,子表单没有批量导入按钮
宜搭,子表单,批量导入,公开访问,没有批量导入功能
公开访问,子表单没有批量导入按钮
|
JavaScript
form表单提交后,页面弹出成功或者失败的信息
form表单提交后,页面弹出成功或者失败的信息
167 0
jquey清空表单内容
jquey清空表单内容
54 0
|
存储 缓存 JavaScript
07设置用户头像的大小 授权获取用户的信息 缓存
07设置用户头像的大小 授权获取用户的信息 缓存
07设置用户头像的大小 授权获取用户的信息 缓存
|
前端开发
细讲前端设置cookie, 储存用户登录信息
我们都知道如果想做一个用户登录并使浏览器保存其登录信息,使得用户下次再访问网页的时候无需再次进行登录操作,我们需要用到 cookies , 今天我们就来讲讲前端如何给客户端设置 cookie cookie 只有在服务环境下,才能设置,所以如果要尝试练习设置cookie的话,可以使用webstorm编辑器, 它内部自带服务环境,如果用别的编辑器的小伙伴的话,先自己搭一个简单的服务环境哦~
1059 0
细讲前端设置cookie, 储存用户登录信息
表单一次性上传多个文件
表单一次性上传多个文件
169 0
表单一次性上传多个文件
|
Java Spring
spring boot 中对修改的头像进行更改,同时删除原来的头像,头像是初始头像不删除,信息保存session,实时更新
spring boot 中对修改的头像进行更改,同时删除原来的头像,头像是初始头像不删除,信息保存session,实时更新
551 0
|
SQL
【自然框架】表单控件 之 一个表单修改多个表里的记录
      FormView 确实挺方便的,不过他也有几个小问题,只把FormView拖到页面里是不行的,还得再拽几个文本框、下拉列表框这一类的控件,还得布局。然后还要弄一个DataSource的控件,利用这个控件把文本框等控件和字段对应上,DataSource也有一个致命的缺点,默认情况下,他是把SQL语句以属性的形式放在了.aspx页面里面。
903 0