我有一个多步表单，用户可以导航到任何页面来修改或添加信息。有一个菜单显示当前进度，用户完成的步骤，并允许导航到任何已完成或未决的步骤。检查网页表单值是否已更改
尽管有一个大的按钮“保存并继续”，但有些用户点击此菜单进一步导航。我必须检查 - 如果表格中的值已更改并询问：“保存更改？是/否”。
建议我检查表单值是否发生了变化，最好的方法是什么（使用最少的客户端JavaScript代码）？
编辑了一下后：
我忘了告诉大家，多步骤的形式使用步骤之间的回传。
jQuery的 “脏表” 插件，可以帮助你在这里：
非常感谢你。它看起来很有希望:) 我会试一试 – 2010-05-17 09:27:26
插件似乎不是很灵活，所以我不得不改变一下代码。但无论如何它为我节省了很多时间。谢谢你的回答:) – 2010-05-17 11:14:01
它似乎也是buggish） – 2010-05-17 11:21:26
这不是没有JQuery的省事，因为没有始终如一地跨浏览器支持onchange事件的形式。
我想说如果可以的话，请使用其他答案中提供的jQuery插件之一。
如果jQuery不存在问题，请考虑为每个输入元素添加一个简单的。如果你想要一个干净的做法，这样做在<script>部分：
document.getElementById("formid").onchange =
function() { if (this.value ....) }
之间的回复感谢您的回复，但那完全是我害怕:) 我会看看： http：//plugins.jquery。 com/project/dirtyform – 2010-05-17 09:28:40
既然你提到你回发步骤之间，我必须存储的下一步是什么隐藏字段。默认情况下，这将是表单的下一步。 “保存并继续”按钮只是提交表单。
然后，每个菜单条目都会将此隐藏表单的值设置为适当的步骤，然后它会提交表单。例如：
<script type="text/javascript">
function goToStep(step) {
document.getElementById("hiddenFieldID").value = step;
document.getElementById("formID").submit();
}
</script>
<ul id="menu">
<li><a href="javascript:goToStep(1);">Step 1</a></li>
<li><a href="javascript:goToStep(2);">Step 2</a></li>
etc...
</ul>
谢谢，但问题是如何检查表单是否脏） – 2010-05-17 09:43:34
试着检查这样的表单值。 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;
}
需要更多的信息。表单的每个页面都是单独的URL吗？他们在导航表单时来回发布吗？或者它是完全客户端使用jQuery或JavaScript？另外，你使用什么服务器端语言？ PHP？ Rails的？蟒蛇？ etc .. – rossipedia 2010-05-17 09:19:37
对不起，我只提到javascript客户端代码 – 2010-05-17 09:22:46