jquery监控数据是否变化(修正版)


Posted in Javascript onApril 12, 2011
///<reference path="query-1.5.1.min.js" /> 
(function($) { 
/*监控页面数据是否发生变化*/ 
var pageDataChange = false; 
var tagName = "Input, Select, Textarea"; 
var ctrlIds = []; 
$.fn.MonitorDataChange = function(options) { 
var deafult = { 
arrTags: tagName, //需监控控件的tagName属性 
arrCtrls: ctrlIds //不监控的控件ID 
}; 
var ops = $.extend(deafult, options); 
tagName = ops.arrTags; 
ctrlIds = ops.arrCtrls; 
/*元素第一次获取焦点时缓存该元素数据*/ 
$(ops.arrTags).one("focus", function() { 
if ($.inArray($(this).attr("id"), ops.arrCtrls) != -1) { 
return; 
} 
$(this).data('initData', $(this).val()); 
}); 
}; 
/*获取页面数据是否已经改变*/ 
$.fn.isChange = function() { 
$(tagName).each(function() { 
if ($.inArray($(this).attr("id"), ctrlIds) != -1) { 
return; 
} 
/*如果该元素的initData缓存数据已定义并且不等于他的value值,标识该页面中数据发生变化*/ 
if (typeof ($(this).data('initData')) != 'undefined') { 
if ($(this).data('initData') != $(this).val()) { 
pageDataChange = true; 
} 
} 
}); 
return pageDataChange; 
}; 
})(jQuery);

前台调用:
<script type="text/javascript"> 
var is_change = false; 
$(document).ready(function() { 
$("form").MonitorDataChange(); 
}); 
function alertMsg() { 
is_change = $.fn.isChange(); 
if(is_change){ 
alert('数据发生改变!'); 
} 
} 
</script> 
<input type="text"/> 
<input type="text" /> 
<input type="text" /> 
<input type="text" /> 
<asp:TextBox runat="server"></asp:TextBox> 
<asp:CheckBox runat="server" /> 
<input type="button" value="true" onclick="alertMsg();"/>
Javascript 相关文章推荐
js操作时间(年-月-日 时-分-秒 星期几)
Jun 20 Javascript
javascript对select标签的控制(option选项/select)
Jan 31 Javascript
jQuery检测输入的字符串包含的中英文的数量
Apr 17 Javascript
Spring Boot+AngularJS+BootStrap实现进度条示例代码
Mar 02 Javascript
javascript 跨域问题以及解决办法
Jul 17 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
Jul 18 Javascript
ECMAscript 变量作用域总结概括
Aug 18 Javascript
学习Vue组件实例
Apr 28 Javascript
让Vue也可以使用Redux的方法
May 23 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
Mar 19 Javascript
微信小程序云开发实现云数据库读写权限
May 17 Javascript
vue路由守卫及路由守卫无限循环问题详析
Sep 05 Javascript
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
Apr 12 #Javascript
javascript 学习笔记(八)javascript对象
Apr 12 #Javascript
jQuery的初始化与对象构建之浅析
Apr 12 #Javascript
避免回车键导致的页面无意义刷新的解决方法
Apr 12 #Javascript
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
Apr 12 #Javascript
javascript实现上传图片并预览的效果实现代码
Apr 11 #Javascript
window.dialogArguments 使用说明
Apr 11 #Javascript
You might like
简单的过滤字符串中的HTML标记
2006/12/25 PHP
ajax+php打造进度条 readyState各状态
2010/03/20 PHP
PHP MemCached高级缓存配置图文教程
2010/08/05 PHP
PHP数据类型的总结分析
2013/06/13 PHP
2014年10个最佳的PHP图像操作库
2014/07/14 PHP
PHP实现将科学计数法转换为原始数字字符串的方法
2014/12/16 PHP
8个PHP程序员常用的功能汇总
2014/12/18 PHP
JSON字符串传到后台PHP处理问题的解决方法
2016/06/05 PHP
PHP实现查询手机归属地的方法详解
2017/04/28 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
Yii2处理密码加密及验证的方法
2019/05/12 PHP
点击广告后才能获得下载地址
2006/10/26 Javascript
Javascript中的var_dump函数实现代码
2009/09/07 Javascript
url 编码 js url传参中文乱码解决方案
2010/04/11 Javascript
javascript函数中的arguments参数
2010/08/01 Javascript
THREE.JS入门教程(2)着色器-上
2013/01/24 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
javascript返回顶部的按钮实现方法
2016/01/09 Javascript
js将键值对字符串转为json字符串的方法
2018/03/30 Javascript
Vue.js 实现微信公众号菜单编辑器功能(一)
2018/05/08 Javascript
jQuery位置选择器用法实例分析
2019/06/28 jQuery
node中使用log4js4.x版本记录日志的方法
2019/08/20 Javascript
Django中实现一个高性能计数器(Counter)实例
2014/07/09 Python
深入理解Django中内置的用户认证
2017/10/06 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
python实现的Iou与Giou代码
2020/01/18 Python
Python中import导入不同目录的模块方法详解
2020/02/18 Python
Python3监控windows,linux系统的CPU、硬盘、内存使用率和各个端口的开启情况详细代码实例
2020/03/18 Python
Django中Aggregation聚合的基本使用方法
2020/07/09 Python
HTML5 Canvas之测试浏览器是否支持Canvas的方法
2015/01/01 HTML / CSS
职业女性的职业规划
2014/03/04 职场文书
服装发布会策划方案
2014/05/22 职场文书
优秀团队申报材料
2014/12/26 职场文书
2015年依法治校工作总结
2015/07/27 职场文书
用JS创建一个录屏功能
2021/11/11 Javascript
《游戏王:大师决斗》将推出新卡牌包4月4日上线
2022/03/31 其他游戏