javascript - 获取网页中所有输入字段的更改的最佳方法

Question

我想创建一个确认来处理页面的更改。例如gmail或其他许多其他网站都有一个系统，当您更改页面中的字段以及当您想要离开页面或清除表单输入时，该网站将创建一个确认对话框，帮助您保存您忘记的更改。 。这是我的解决方案，但我想知道是否有更好的方法。该项目也是 JSF 项目并使用 primefaces 3.4
解决方案:
1.创建全局js变量

var isChanges = false;

1. 将处理程序放在所有输入字段的 onchanges 方法上。

< p:inputText value="#{someMB.someValue}" id="id" onkeydown="isChanges=true">< /p:inputText>
or
< p:selectOneMenu value="#{someMB.someValue}" id="#{cc.attrs.id}" >
< p:ajax event="change" onsuccess="isChanges=true" />
< /p:selectOneMenu>
etc....

检测用户是否离开页面或清除表单输入:

< script language="JavaScript">
  window.onbeforeunload = confirmExit;
  function confirmExit()
  {
      if(isChanged && window.confirm("sometext")){
        // Call servers save method
      }
  }

< /script>

Answer 1

在我的网络应用程序中，我这样做:

1. 页面加载时，抓取所有表单，除了具有特殊 noHash 类的表单
2. 对于上述步骤中找到的每个表单，获取除具有特殊 noHash 类的字段之外的所有字段
3. 将字段名称和值序列化为字符串，例如“var1=1&var2=2[...]”
4. 计算上面定义的字符串的 sha1
5. 将结果存储为全局变量

然后，当用户尝试离开时，我会按照上述方式重新计算哈希值，并查看哈希值是否不同，如果不同，我会在离开页面之前提示用户进行确认。

请注意，这全部都是使用 JavaScript 完成的，因此与您的服务器端脚本语言无关。