检查Web表单值是否已更改

Question

我有一个多步骤表单,用户可以导航到任何页面来修改或添加信息.有一个菜单显示当前进度,用户已完成的步骤,并允许导航到任何已完成或待处理的步骤.

尽管有一个大按钮"保存并继续",一些用户点击此菜单进一步导航.我必须检查 - 如果表格中的值已更改并询问:"保存更改？是/否".

什么是最好的方法(使用最少的客户端JavaScript代码),建议我检查表单值是否已更改？

稍后编辑:

我忘了告诉多步表单在步骤之间使用回发.

Answer 1

jQuery"Dirty Form"插件可以帮助你:

http://plugins.jquery.com/project/dirtyform

Answer 2

尝试检查这样的表单值.initFormChangeCheck()的调用将所有值复制到镜像对象中,并在每个表单元素上设置调用checkChange例程的事件mousedown和keydown.您也可以按间隔检查.

var fList = new Object();
function initFormChangeCheck() {
  for (var fOi = 0; fOi < document.forms[0].elements.length; fOi++) {
    el = document.forms[0].elements[fOi];
    fList[el.name] = el.value;
    el.onmousedown = checkChange;
    el.onkeydown = checkChange;
  }
}
function checkChange() {
  var changed = false;
  for (var fOi = 0; fOi < document.forms[0].elements.length; fOi++) {
    el = document.forms[0].elements[fOi];
    if (fList[el.name] != el.value) {
      changed = true;
    }
  }
  document.forms[0].show_invoice.disabled = changed;
}

彼得 Gotrendy新闻