0

Enterキーが押された場合にフォームを送信するために、次のjqueryコードを使用しています。

$('body').on('keypress', 'input', function(event) {
    if (event.which === 13) {
        event.preventDefault();
        $(this).closest('form').submit();
    }
});

また、ページの読み込み時にユーザー名フィールドにログインページを .focus() に設定しています。

したがって、ユーザーが「Enter」キーを押したままにすると、送信、失敗、戻り、フォーカス、送信、繰り返しが行われます。

パスワードフィールドにいるときにのみキープレスイベントをトリガーするように設定できますが、長いキープレスまたはこのシナリオを防ぐための何かを検出する方法を見つけたいと思います。

4

2 に答える 2

2

イベントが 1 秒に 1 回だけ発生するように調整します。

var timer;
$('body').on('keypress', 'input', function(event) {
    var self = this;
    if (event.which === 13) {
        event.preventDefault();
        clearTimeout(timer);
        timer = setTimeout(function(){
            $(self).closest('form').submit();                
        },1000)
    }
});
于 2012-10-03T21:33:15.647 に答える
0

Blender が言うように、ほとんどのブラウザでは、Enter キーを押したときにフォームを送信するのが、フォームへの入力のデフォルトの動作です (送信タイプの入力をクリックするようなものです)。

最初のコードは、デフォルトの動作 (フォームの送信) を妨げているため、少し役に立たないように見えますが、最終的にフォームを送信します。

タイムアウトの解決策は悪くはありませんが、このような問題に対する私の観点では複雑すぎます。

あなたのページはログインページです。これは、ログインとパスワードが入力されたときにログイン試行を許可することを意味します。さらに、短い遅延で同じページの複数の送信を許可したくありません。

次のようなコードを記述できます。

// Listening on submit event of the form
$("#FORM_ID").submit(function(submitEvent) {

    // Check if the login and password are not empty
    if (($.trim($("#LOGIN_INPUT_ID").val())).length == 0 ||
        ($.trim($("#PASSWORD_INPUT_ID").val())).length == 0)
    {
        // login or password is empty -> cancel the submit
        submitEvent.preventDefault();

        // TODO : warn user with a message
        // like "Please, fill login and password first !"

        return false;
    }

    // Avoid multiple submit at the same time
    // (for stupid guy clicking 10 times in 1 s)
    if ($(this).hasData('alreadySubmitted'))
    {
        // The form is currently already submit -> cancel the submit
        submitEvent.preventDefault();
        return false;
    }

    // Set the form "submitted"
    $(this).data('alreadySubmitted', true);

   // Let the submit do his job...
   return true;
});
于 2012-10-03T22:06:02.130 に答える