jquery监控数据是否变化(修正版)
复制代码代码如下:
///<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();"/>
相关推荐
在"jquery监控数据是否发生改变"这个主题中,我们将深入探讨如何利用jQuery来检测和响应页面上特定数据或控件的变化。这在实现动态交互、实时验证或者保存用户输入等场景中尤其有用。 首先,jQuery提供了`change()`...
在网页开发中,有时我们需要确保用户在离开页面或者点击保存按钮前,已...通过jQuery的扩展功能,我们可以轻松地集成到现有的项目中,实现对页面数据变化的智能检测。这不仅提高了用户体验,也增强了数据管理的安全性。
代码如下: ///”query-1.5.1.min.js”> (function($) { /*监控页面数据是否发生变化*/ var pageDataChange = false; var tagName = “Input, Select, Textarea”; var ctrlIds = []; $.fn.MonitorDataChange = ...
总结来说,JQuery提供了一套相对简单但功能强大的方法来实现表单数据变化的监控和记录。通过序列化表单数据,我们可以很方便地捕获数据变化,并结合其他技术手段(如中英文对照的映射对象)来实现详细的变更记录。这...
**jQuery DataLazyLoad 数据延迟加载插件** 在Web开发中,数据延迟加载(Data Lazy Load)是一种优化网页性能的技术,它允许我们只在用户需要时才加载数据或内容,而不是一次性加载所有信息。jQuery DataLazyLoad...
本项目是一个基于jQuery、jqPlot、Servlet和Ajax技术构建的CPU性能实时监控系统演示。它展示了如何通过前端和后端的交互,动态地在Web页面上展示服务器的CPU使用情况,帮助管理员实时了解系统负载。 首先,jQuery是...
同时,CSS3引入了动画和过渡效果,可用于图表数据变化时的平滑过渡,增加互动性。 四、JavaScript与jQuery JavaScript是实现动态功能的关键。例如,我们可以用它来动态加载和更新数据,响应用户交互,或者创建图表...
通过上述方法,我们可以利用jQuery创建一个显示内存使用情况的图表,并在页面打开后实时监控内存变化,同时注意优化代码以减少内存占用。在开发过程中,记得不断测试和优化,以提供最佳的用户体验。
这在实时监控或者大数据分析场景中非常常见。 5. **交互功能**:ECharts 支持多种交互方式,如点击、鼠标悬浮、缩放、平移等。你可以利用 jQuery 监听这些事件,并根据需要执行相应的回调函数。 6. **图表组件**:...
例如,它可以用于创建平滑的地图缩放、车辆移动动画,或者以视觉效果展示数据变化。 4. **Ajax交互**:急救过程中,实时数据交换至关重要。jQuery的Ajax函数可以轻松实现异步数据请求,确保系统能够实时获取并更新...
超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝大多数要点、技巧与方法,堪称史上最实用的jQuery代码参考书,可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...
- 《jQuery操作json数据技巧汇总》:掌握处理JSON数据的方法。 - 《jQuery扩展技巧总结》:学习如何扩展jQuery以满足特定需求。 - 《jQuery选择器用法总结》:熟练掌握jQuery选择器,提升DOM操作效率。 以上内容...
4. **监听URL变化**:利用`jquery.history.js`插件监听URL哈希的变化,每当哈希值改变,就调用`checkCode()`函数,这样在用户点击浏览器的前进或后退按钮时,页面会根据新的哈希值加载相应的Ajax内容。 请注意,...
无论你是想展示销售数据、分析用户行为,还是监控系统状态,jQuery图表库都能提供有效的解决方案。通过深入学习和实践,你将能够创建出既美观又实用的数据展示界面,提升用户体验并帮助决策者更好地理解数据。
总结来说,通过重写`$.ajax`并维护一个计数器,我们可以轻松监控页面上所有的jQuery AJAX请求。这为我们提供了更大的灵活性,无论是跟踪所有请求,还是仅关注特定URL的请求,都可以轻松实现。同时,jQuery提供的各种...
在网页上,当用户需要对一组选项进行全部选中或全部取消时,这种功能特别实用,例如在数据筛选、表单提交等场景。插件通常通过监听复选框的变化,来控制其他关联复选框的状态。 `index.html`是网页的入口文件,它...
jQuery Suggest插件监听用户的输入事件,每当输入内容发生变化时,它会触发一个回调函数,该函数负责处理数据匹配和获取建议的过程。匹配算法通常基于字符串的模糊匹配,如Levenshtein距离、Jaccard相似度等。获取...