0

我有大约 100 个输入字段的表单（文本框、文本区域、单选框、复选框、文件等）。
当用户离开页面时，我需要知道某些字段是否已被修改以运行自动保存例程。

1.-form_has_been_modified在任何字段更改时设置：

var form_has_been_modified = 0;
$("form[id^='my_form']").each(function(){
    $(":input", this).live("change", function() {
        form_has_been_modified = 1;
    });
});

2.- 如果某些字段被更改，警告用户：

window.onbeforeunload = function (e) {
    if ( ! form_has_been_modified){
        return;
    }

    var message = "This page is asking you to confirm that you want to leave - data you have entered may not be saved.";

    var e = e || window.event;

    // For IE and Firefox prior to version 4
    if (e) {
        e.returnValue = message;
    }

    // For Safari
    return message;
};

问题：

a.- 这段代码（第 1 部分）会使浏览器的用户变得太慢吗？

b.- 之前的代码运行良好。但在textbox/textarea输入类型中，change事件仅在元素失去焦点时发生。因此，例如，此代码不能防止reload page操作。是否存在另一个更好的处理程序change来解决这个缺陷？

4

3 回答 3

3

这个怎么样 

$('#form').data('serialize',$('#form').serialize());
  // On load save form current state

$(window).bind('beforeunload', function(e){
    if($('#form').serialize()!=$('#form').data('serialize'))return true;
    else e=null;
    // i.e; if form state change show box not.
});

您可以使用 Google JQuery Form Serialize 函数，这将收集所有表单输入并将其保存在数组中。我想这个解释就足够了:)

于 2014-01-11T10:06:13.057 回答
2

我会使用keyup，这可能足够接近，尽管您可能会得到一些误报。

此外，您可以用一个调用.on()替换您的循环（无论如何在 1.7+ 中已被弃用）：.each().live()

$("form[id^='my_form']").on("change keyup", ":input", function() {
     form_has_been_modified = 1;
});
于 2012-04-23T20:19:13.053 回答
1

对于第一部分，您可能希望在return false;找到更改的表单字段后添加以中断循环......因此您不必费心检查所有其余字段。当然，这是假设您只需要知道是否有任何字段已更改，而不是所有已更改的列表。鉴于此，如果字段 #2 发生更改，为什么要花时间检查所有剩余的 98 个字段。

于 2012-04-23T20:24:53.163 回答