JQUERY表单暂存功能插件分享


Posted in Javascript onFebruary 23, 2016

jquery.formLocalStorage 是一个实现通用表单暂存功能的jquery插件

原理:

监控表单域变化,并使用HTML5 WebStorage中的localStorage来存储这些有变化的表单域的值,并在从新加载表单时将存储的值载入回表单域中,从而实现暂存功能。

功能特点:

1.不使用服务器端存储,节省服务器资源。

2.代码简练,使用默认配置的话只需一小段代码 $("#your_form_id").formLocalStorage(); 即可搞定,无需写一大坨服务器端逻辑。

3.丰富的配置项与默认值,通过配置项可以自定义暂存内容的样式,暂存加载完毕、存储完毕与删除完毕后的回调事件以及暂存的存储命名规则,也可使用默认值从而减少过度的配置工作。

用法:

1.使用默认配置:

$("#your_form_id").formLocalStorage();

2.使用自定义配置:

$("#your_form_id").formLocalStorage({
  storage_name_perfix : 'your_storage_name_perfix', //自定义暂存存储的命名前缀
  storage_events : 'click' //自定义暂存触发事件
});

已知的问题:

1.有些动态写入表单项的内容无法监测到,也不能暂存。

2.默认的storage_name_perfix是this.context.URL + form_selector + "@",在提交后若this.context.URL发生变化则会定位不到暂存,最好使用别的唯一值作为默认storage_name_perfix

插件下载  http://xiazai.3water.com/201602/yuanma/jquery.formLocalStorage(3water.com).zip

Javascript 相关文章推荐
Java File类的常用方法总结
Mar 18 Javascript
js实现select跳转菜单新窗口效果代码分享(超简单)
Aug 21 Javascript
jquery判断输入密码两次是否相等
Apr 22 Javascript
js动态添加的DIV中的onclick事件简单实例
Jul 25 Javascript
JS实现隔行换色的表格排序
Mar 27 Javascript
整理关于Bootstrap警示框的慕课笔记
Mar 29 Javascript
javascript 判断一个对象为数组的方法
May 03 Javascript
微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码
Nov 09 Javascript
微信小程序与后台PHP交互的方法实例分析
Dec 10 Javascript
vue使用Google地图的实现示例代码
Dec 19 Javascript
vue实现列表滚动的过渡动画
Jun 29 Javascript
基于vue 动态菜单 刷新空白问题的解决
Aug 06 Javascript
JavaScript简单实现鼠标移动切换图片的方法
Feb 23 #Javascript
jQuery实现返回顶部功能
Feb 23 #Javascript
JavaScript添加随滚动条滚动窗体的方法
Feb 23 #Javascript
理解javascript定时器中的单线程
Feb 23 #Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
Feb 23 #Javascript
教你如何终止JQUERY的$.AJAX请求
Feb 23 #Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 #Javascript
You might like
php 保留小数点
2009/04/21 PHP
PHP 编写大型网站问题集
2010/05/07 PHP
PHP批量去除BOM头内容信息代码
2016/03/11 PHP
Zend Framework教程之Application用法实例详解
2016/03/14 PHP
Yii2 输出xml格式数据的方法
2016/05/03 PHP
php模式设计之观察者模式应用实例分析
2019/09/25 PHP
jQuery函数的等价原生函数代码示例
2013/05/27 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
2013/06/04 Javascript
简单实用jquery版三级联动select示例
2013/07/04 Javascript
jquery自动填充勾选框即把勾选框打上true
2014/03/24 Javascript
javascript比较两个日期相差天数的方法
2015/07/24 Javascript
13个PHP函数超实用
2015/10/21 Javascript
jQuery ajax请求返回list数据动态生成input标签,并把list数据赋值到input标签
2016/03/29 Javascript
BooStrap对导航条的改造实践小结
2016/09/21 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
2016/12/08 Javascript
小发现之浅谈location.search与location.hash的问题
2017/06/23 Javascript
Javascript实现一朵从含苞到绽放的玫瑰
2019/03/30 Javascript
亲自动手实现vue日历控件
2019/06/26 Javascript
taro小程序添加骨架屏的实现代码
2019/11/15 Javascript
[02:17]DOTA2亚洲邀请赛 RAVE战队出场宣传片
2015/02/07 DOTA
Python实现的监测服务器硬盘使用率脚本分享
2014/11/07 Python
python中的代码编码格式转换问题
2015/06/10 Python
python:接口间数据传递与调用方法
2018/12/17 Python
Python3.4学习笔记之常用操作符,条件分支和循环用法示例
2019/03/01 Python
django ModelForm修改显示缩略图 imagefield类型的实例
2019/07/28 Python
Python动态强类型解释型语言原理解析
2020/03/25 Python
Python中如何添加自定义模块
2020/06/09 Python
pytorch VGG11识别cifar10数据集(训练+预测单张输入图片操作)
2020/06/24 Python
如何基于Django实现上下文章跳转
2020/09/16 Python
英语道歉信范文
2014/01/09 职场文书
偷看我的初中毕业鉴定
2014/01/29 职场文书
会计专业求职信范文
2014/03/16 职场文书
高中学生评语大全
2014/04/25 职场文书
组织鉴定材料
2014/06/02 职场文书
仙境之桥观后感
2015/06/16 职场文书
Nginx配置之实现多台服务器负载均衡
2021/08/02 Servers