JQuery - フォーム送信 - 何回ですか？

Question

は、私は私のjavascriptのコードを、簡単な質問を持ってIましたこの：

\t $('form').submit(function (e) { 
 
\t \t var form = $(this); 
 
\t \t console.log('submit attempt'); 
 
\t \t $('input, select, textarea').each(function() { 
 
\t \t \t var attr = $(this).attr('required'); 
 
\t \t \t if (typeof attr == typeof undefined || attr == false || (attr = 'Y' && $(this).val() != '')) { 
 
\t \t \t \t if($(this).hasClass('numeric')) { 
 
\t \t \t \t \t if(isNumber($(this).val())) { 
 
\t \t \t \t \t \t $(form).submit(); 
 
\t \t \t \t \t } 
 
\t \t \t \t } 
 
\t \t \t \t else { 
 
\t \t \t \t \t $(form).submit(); 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t \t else { 
 
\t \t \t \t e.preventDefault(); 
 
\t \t \t \t $(this).css('border','1px solid red'); 
 
\t \t \t } 
 
\t \t }); 
 
\t });

とコンソールログに私は、エラー '試みを提出' の1300件のメッセージを乗り越え：

Uncaught RangeError: Maximum call stack size exceeded

あなたはこれがどうして起こり、どのように解決するのか考えていますか？私は忘れてしまったのですか？

さらに必要な情報がある場合は教えてください。

ありがとうございました！

Answer 1

エラーがなければ、フォームはすべての入力またはテキストエリアで送信されます。

したがって、最初にフィールドをループし、エラーがある場合に定義します。ない場合は、それを送信：

$('form').submit(function(e) { 
    var form = $(this); 
    var failure = false; 
    console.log('submit attempt'); 
    $('input, select, textarea').each(function() { 
    var attr = $(this).attr('required'); 
    if (typeof attr == typeof undefined || attr == false || (attr = 'Y' && $(this).val() != '')) { 
     failure = true; 
     $(this).css('border', '1px solid red'); 
    } 
    if ($(this).hasClass('numeric') && !isNumber($(this).val())) { 
     failure = true; 
     $(this).css('border', '1px solid red'); 
    } 
    }); 
    if (failure) { 
    e.preventDefault(); 
    } 
}); 

Answer 2

問題は、再帰的に呼び出す提出以内に再度フォームを提出していることです。これがあなたのやり方です。検証に失敗した場合、isValidにはfalseが含まれ、フォームの送信が停止されます。

$('form').submit(function(e){ 
var isValid = true; 
    $('input, select, textarea').each(function() { 
      var attr = $(this).attr('required'); 
      if (typeof attr == typeof undefined || attr == false || (attr = 'Y' && $(this).val() != '')) { 
       if($(this).hasClass('numeric')) { 
        if(!isNumber($(this).val())) { 
         isValid = false; 
      return isValid; 
        } else { 
          e.preventDefault(); 
          $(this).css('border','1px solid red'); 
        } 
       } 

      } 
      else { 
     e.preventDefault(); 
       $(this).css('border','1px solid red'); 
     isValid = false; 
     return isValid; 
      } 
     }); 
    return isValid; 

});