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誤検知が発生する可能性はありますが、これは十分に近い可能性があります。

また、ループを1回の呼び出しに.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 に答える