コントロールの編集を検知

関数オブジェクト、クラスを使用

  var _modified = false;
  
  function addRow() {
    var table = document.getElementById("SampleTable");
    var row   = table.insertRow(table.rows.length);
    row.insertCell(0).innerHTML = "<select name='numbers'>"
                                +    "<option value='1'>1"
                                +    "<option value='2'>2"
                                +    "<option value='3'>3"
                                + "</select>";
    row.insertCell(1).innerHTML = "<input type='text' name='message' size='16em' value='' />";
    attachOnchangeEvent();
  }

  function deleteRow() {
    var table    = document.getElementById("SampleTable");
    var delIndex = table.rows.length-1;
    if (delIndex > 0) {
      table.deleteRow(delIndex);
    }
  }

  function checkModified() {
    if (_modified) {
      alert("変更されています。");
    } else {
      alert("変更されていません。");
    }
  }
  function modified() {
    _modified = true;
  }
  
  function attachOnchangeEvent() {
    var controls = myForm.elements;
    for (var i=0; i<controls.length; i++) {
      if (controls[i].onchange == null) {
        type = controls[i].type;

        if ( type == "text" 
          || type == "select-one" 
          || type == "checkbox" 
          || type == "textarea"
          || type == "radio") {
          controls[i].onchange = modified;
        }  
      }
    }
  }