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 相关文章推荐
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
Dec 08 Javascript
JS读取XML文件示例代码
Nov 15 Javascript
解决extjs grid 不随窗口大小自适应的改变问题
Jan 26 Javascript
javascript制作游戏开发碰撞检测的封装代码
Mar 31 Javascript
JavaScript转换二进制编码为ASCII码的方法
Apr 16 Javascript
JS/Jquery判断对象为空的方法
Jun 11 Javascript
js全选按钮的实现方法
Nov 17 Javascript
js实现prototype扩展的方法(字符串,日期,数组扩展)
Jan 14 Javascript
JS中将多个逗号替换为一个逗号的实现代码
Jun 23 Javascript
JS如何寻找数组中心索引过程解析
Jun 01 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 Javascript
在vue中封装方法以及多处引用该方法详解
Aug 14 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读取mssql的ntext字段返回值为空的解决方法
2014/12/30 PHP
写一段简单的PHP建立文件夹代码
2015/01/06 PHP
PHP购物车类Cart.class.php定义与用法示例
2016/07/20 PHP
PHP链表操作简单示例
2016/10/15 PHP
In Javascript Class, how to call the prototype method.(three method)
2007/01/09 Javascript
让ie运行js时提示允许阻止内容运行的解决方法
2010/10/24 Javascript
javascript之典型高阶函数应用介绍
2013/01/10 Javascript
Javascript表格翻页效果实现思路及代码
2013/08/23 Javascript
js对table的td进行相同内容合并示例详解
2013/12/27 Javascript
jquery选择器之基本过滤选择器详解
2014/01/27 Javascript
JS制作手机端自适应缩放显示
2015/06/11 Javascript
jquery实现左右滑动菜单效果代码
2015/08/27 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
2015/12/15 Javascript
浅析AngularJS中的指令
2016/03/20 Javascript
AngularJS+bootstrap实现动态选择商品功能示例
2017/05/17 Javascript
原生JS实现的双色球功能示例
2018/02/02 Javascript
jQuery 防止相同的事件快速重复触发方法
2018/02/08 jQuery
vue二级菜单导航点击选中事件的方法
2018/09/12 Javascript
[10:34]DOTA2上海特级锦标赛全纪录
2016/03/25 DOTA
推荐下python/ironpython:从入门到精通
2007/10/02 Python
react+django清除浏览器缓存的几种方法小结
2019/07/17 Python
python有序查找算法 二分法实例解析
2020/02/18 Python
python绘图pyecharts+pandas的使用详解
2020/12/13 Python
Avène雅漾美国官方网站:敏感肌肤护理专家
2016/10/24 全球购物
澳大利亚首屈一指的鞋类品牌:Tony Bianco
2018/03/13 全球购物
澳大利亚女性快速时尚零售商:Ally Fashion
2018/04/25 全球购物
Tuckernuck官网:经典的美国品质服装、鞋子和配饰
2021/01/11 全球购物
人力资源专员自我评价怎么写
2013/09/19 职场文书
八年级生物教学反思
2014/01/22 职场文书
学校评语大全
2014/05/06 职场文书
公司应聘自荐书
2014/06/14 职场文书
授权委托书格式范文
2014/08/02 职场文书
企业领导班子四风对照检查材料
2014/09/27 职场文书
财务部岗位职责范本
2015/04/14 职场文书
《折线统计图》教学反思
2016/02/22 职场文书
2019年消防宣传标语集锦
2019/11/21 职场文书