0

各タブに異なるフォームを含む 4 つの jQuery タブを含むページがあります。各フォームは、 100 を超えてはならない数値を取ることになっています。

入力された数値が 100 未満であることを確認するためにフォームを検証するために、次の jQuery コードを作成しました。 

 $(document).ready(function(){ 
    var preventSubmit = 0;
    $('#targetForm').submit(function(){
        $(':input', '#targetForm').each(function(){
            if(this.value > 100){
                $('#message').fadeIn();
                $('#message').fadeOut(4000);
                prevent = 1;

            }//END IF

        });
        if(preventSubmit == 1){
            preventSubmit = 0;
            return false;
        }//END IF
    });
});

正常に動作しますが、最初のタブのフォームでのみです。2 番目のタブをクリックして無効なデータ (100 以上) を送信すると、検証されません。

何か案は？

ありがとうございました

4

1 に答える 1

0

.submit()各タブをクリックし、AJAX リクエストによるフォームの変更が完了したら、次の呼び出しを行ってハンドラーをフォームに再度アタッチしてください。

$('#targetForm').submit(function() {
  $(':input', '#targetForm').each(function() {
    if (this.value > 100) {
      $('#message').fadeIn();
      $('#message').fadeOut(4000);
        prevent = 1;
    }
  });

  if (preventSubmit == 1) {
    preventSubmit = 0;
    return false;
  }
});

これがグローバル Javascript であると仮定すると、ページが最初に読み込まれたときに一度だけ実行されます。AJAX リクエストが送信され、同じページでフォームが変更された場合、再度実行されることはありません。したがって、AJAX リクエストが返された後、この関数を再度呼び出して、新しく変更されたフォームに存在することを確認する必要があります。

于 2013-06-22T06:08:47.890 に答える