フォームの送信を禁止する - jquery？

Question

可能性の重複：ここ
How to prevent form from being submitted?

は私のjqueryのコードは次のとおりです。

$(document).ready(function() { 
    $("#register").submit(function (event) { 
    var email = $('#email-agency').val(); 
    /* EMAIL VALIDATION */ 
    if (email == ""){ 
     $('#email-agency').css({"border-color":"#3399ff"}); 
     $('#email-err').html("You must enter your e-mail address.").removeClass("success_msg").addClass("error_msg"); 
    }else{ 
     $('#email-err').html("<img src='http://www.site.com/folder/ajax-loader.gif' />&nbsp;&nbsp;&nbsp;Validating the e-mail address...").removeClass("success_msg").removeClass("error_msg"); 
     $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
      if (result == "invalid format"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html(email + " is not a valid e-mail address.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       return false; 
      }else if (result == "taken"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html("I'm sorry, this e-mail address is already taken.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       return false; 
      }else if (result == "available"){ 
       $('#email-agency').css({"border-color":"#1f6d21"}); 
       $('#email-err').html("Congratulations, this e-mail address is available.").removeClass("error_msg").addClass("success_msg"); 
       return true; 
      } 
     }) 
    } 
}); 

何らかの理由で、メールアドレスが(result == "taken")取られている場合 - まだフォーム提出する。

私は間違っていますか？電子メールアドレスを取得した場合、フォームを送信しないようにするにはどうすればよいですか？

は、あなたのAJAX呼び出しがAJAXの戻り値に変数を設定することはできませんまた、あなた非同期（async）作られているので、あなたが$("#register").submit(function()

の代わりに$.get(function()からfalseを戻ってきているためです

Answer 1

ありがとうコール。

この関数は、AJAX呼び出しがまだ進行中の間に既に終了しているためです。

あなたが使用することができ

：

async: false 

、代わりの真/偽DOを返すやって：偽=有効

VARを。 //機能を提出

の上部に、代わりのリターンを行うには、実行します。valid = true; //または偽

そして、送信関数の最後では、実行します。

return valid; 

はEDIT

申し訳ありません。

.get()のドキュメントを見ると、.get()は非同期パラメータを受けていないようです。

代わりに.ajax()関数を使用できます。 （getはajaxの短縮形です）。

http://api.jquery.com/jQuery.ajax/

EDIT2

$(document).ready(function() { 
    $("#register").submit(function (event) { 

    var valid = false; 

    var email = $('#email-agency').val(); 
    if (email == ""){ 
     $('#email-agency').css({"border-color":"#3399ff"}); 
     $('#email-err').html("You must enter your e-mail address.").removeClass("success_msg").addClass("error_msg"); 
    }else{ 
     $('#email-err').html("<img src='http://www.site.com/folder/ajax-loader.gif' />&nbsp;&nbsp;&nbsp;Validating the e-mail address...").removeClass("success_msg").removeClass("error_msg"); 
     $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
      if (result == "invalid format"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html(email + " is not a valid e-mail address.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       valid false; 
      }else if (result == "taken"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html("I'm sorry, this e-mail address is already taken.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       valid false; 
      }else if (result == "available"){ 
       $('#email-agency').css({"border-color":"#1f6d21"}); 
       $('#email-err').html("Congratulations, this e-mail address is available.").removeClass("error_msg").addClass("success_msg"); 
       valid true; 
      } 
     }) 
    } 
    return valid; 
    }); 
}); 

Answer 2

だけで実行します。

return $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
    //more code 
} 

Answer 3

あなたはあなたの最初の関数が返すことを意味し、非同期呼び出しを行っています。代わりに、最初の呼び出しでfalseを返すようにしたい場合は、何をすべきですか。次に、2番目の呼び出しの答えに応じて、$（ "form"）。submit（）を呼び出すかエラーを表示することができます。今はAJAXコールバックにfalseを返しています。

基本的に、あなたはこれをしたい：

function validate(e){ 
    e.preventDefault(); //Stop form from submitting 

    $.get(/*foo*/, function(response){ 
    if(response){ //yay validates 
     $("form").submit(); 
    }else{ //Doesn't validate show error. 
     $("form .error").show(); 
    } 
    }); 
}