自动识别页面上的所有控件是否被改变过

标签：

     在页面开发的新增或者修改的时候，有时候给页面上的所有控件赋值完之后，点击保存，此页面不关闭，那么问题来了，如果页面上所有的值都不改变，这时候如果继续进行保存操作，着实有些不妥，那么就需要判断页面上的所有控件是否被改变过，接下来方法如下：

1、js如下：

var inputsData;
var textareasData;
var selectsData;

$(function () {
    inputLoad();
});
function inputLoad() {
    var inputs = document.getElementsByTagName("input");
    var textareas = document.getElementsByTagName("textarea");
    var selects = document.getElementsByTagName("select");

    inputsData = new Array(inputs.length);
    for (var i = 0; i < inputs.length; i++) {
        inputsData[i] = inputs[i].value;
        if (inputs[i].type == "radio") {
            inputsData[i] = inputs[i].checked;
        }
    }
    textareasData = new Array(textareas.length);
    for (var i = 0; i < textareas.length; i++) {
        textareasData[i] = textareas[i].value;
    }
    selectsData = new Array(selects.length);
    for (var i = 0; i < selects.length; i++) {
        selectsData[i] = selects[i].value;
    }
}

//验证页面是否通过，返回 true = 通过，false = 不通过
//IsAlert = （0 = 不提示，1 = alert提示，2 = confirm提示）
//errorMessage = （‘0‘ = 不提示 ，其他为验证不通过时提示文字）
//SumbitID =（‘0‘ = 提示完成后不做提交操作，非空则为页面某按钮ID，做click操作）
//isCheckButton = （是否对比button按钮, true = 对比， false = 不对比）
function checkPage(isAlert, errorMessage, SumbitID, isCheckButton) {
    // alert("我是子页面");
    var ReturnBool = false;
    var inputs = document.getElementsByTagName("input");
    var textareas = document.getElementsByTagName("textarea");
    var selects = document.getElementsByTagName("select");
    var hasBeenChanged = false;
    for (var i = 0; i < inputs.length; i++) {
        var istrue = true;
        if (!isCheckButton && inputs[i].type == "submit") {
            istrue = false;
        }
        if (istrue) {
            if (inputs[i].type == "radio" && (inputs[i].checked != inputsData[i])) {
                hasBeenChanged = true;

                inputsData[i] = inputs[i].checked;
            }
            if (inputs[i].type != "radio" && inputsData[i] != inputs[i].value) {
                if (inputs[i].name != "actionType") {
                    hasBeenChanged = true;

                }
                inputsData[i] = inputs[i].value;
            }
        }
    }
    for (var i = 0; i < textareas.length; i++) {
        if (textareasData[i] != textareas[i].value) {
            hasBeenChanged = true;

            textareasData[i] = textareas[i].value;
        }
    }
    for (var i = 0; i < selects.length; i++) {
        if (selectsData[i] != selects[i].value) {
            hasBeenChanged = true;

            selectsData[i] = selects[i].value;
        }
    }
    if (hasBeenChanged) {
        var rbool = false;
        if (isAlert == 0) {
            rbool = true;
        } else if (isAlert == 1) {
            alert(errorMessage)
        }
        if (isAlert == 2) {
            if (confirm(errorMessage)) {
                rbool = true;
            }
        }
        if (rbool == true) {
            if (SumbitID != 0) {
                $("#" + SumbitID).click();
            }
        }
        ReturnBool = true;
    }

    return ReturnBool;
}

2、页面上引用该JS

  <asp:Button class="res" ID="btnSave" runat="server" Text="保存" OnClientClick="return checkPage(0,‘‘,0,true);" onclick="btnSave_Click"  />

该js中引用的参数视情况而定，其作用在js中有所详述。

3、保存完之后，引用js中的inputLoad()方法

 Page.ClientScript.RegisterStartupScript(this.GetType(), "", "<script>alert(‘数据添加成功‘);inputLoad();</script>");

ok了，就是该js总没有判断<input type=‘file‘>的内容，所以，该方法还有待改进。

自动识别页面上的所有控件是否被改变过

标签：

原文地址：http://blog.csdn.net/u010078133/article/details/46560617