javascript 判斷某頁面上的表單資料是否改變過

來源:互聯網
上載者:User

本文轉自:http://info.codepub.com/2008/09/info-22582.html

原文如下:

使用場合:當某個頁面資料修改時,需要執行某些操作時   
在頁面的body載入事件(onload)中加上initFileds()就可以記錄頁面的初始資料
在需要判斷頁面資料是否改變時調用checkModification()方法就可判斷資料是否改變
傳回值為true就是已經改變
傳回值為false就是沒有改變
   
    // 頁面編輯資料
    var inputsData;
    var textareasData;
    var selectsData;
    // 記錄下表單中的原始值
    function initFileds() {
        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;
        }
    }
    /*
     * 判斷表單中值是否被修改了
     * submitCommand 表單有改動時,執行的javascript代碼
     */
    function checkModification(submitCommand) {
        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++) {
            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&&confirm("資料已經改變,是否儲存?")) {
             eval(submitCommand);
         }
    }
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.