jquery监控数据是否发生改变

在实际开发中经常会遇到数据没发生改变是，由于用户不小心点击保存，这样导致数据库的日志增大；还有数据填写好后，忘了添加保存直接关闭页面离开。这样之前的功夫又白费了。解决这些问题的办法就是：监控页面数据是否发生变化。如果发生变化，提示用户保存。如果数据未发生变化。当我们点击保存时，也不需要提交到数据库。

接下来看看解决办法：

///<reference path="jquery-1.3.2-vsdoc2.js" />
 (function($) {
    var pageDataChange = false    //默认标识页面数据未发生改变
    /*监控页面数据是否发生变化*/
    $.fn.MonitorDataChange = function(options) {
        var tagName = new Array('Input', 'Select', 'Textarea');
        var ctrlIds = [];
        
        var deafult = {
            arrTags: tagName,   //需监控控件的tagName属性数组
            arrCtrls: ctrlIds   //不监控的控件ID
        };
        var ops = $.extend(deafult, options);

        for (var i = 0; i < ops.arrTags.length; i++) {
            $(ops.arrTags[i]).each(function() {
                if (ops.arrCtrls.length == 0) {
                    $(this).bind('change', function() {
                        pageDataChange = true;
                    });
                }
                else {
                    var flag = false;
                    for (var j = 0; j < ops.arrCtrls.length; j++) {
                        if ($(this).attr('id') == ops.arrCtrls[j]) {
                            flag = true;
                            break;
                        }
                    }
                    if (!flag) {
                        $(this).bind('change', function() {
                            pageDataChange = true;
                        });
                    }
                }
            });
        }
        return this;
    };
    /*返回页面数据是否发生变化*/
    $.fn.getValue = function() {
        return pageDataChange;
    };
})(jQuery);