jQueryを使用して以下のようなコードを作成しましたが、submit

質問

jQueryを使用して以下のようなコードを作成しましたが、submitがreturn falseされなくて困っています。

ajax通信が終了しないうちに「if($('span.error').size() > 0)」が判断されているためだと思われるのですが、うまくsubmitされないようにする方法はあるでしょうか？

ajaxCompleteとか使って考えてもみましたが。どうしてもできません。どなたかご教示お願い致します。

$(function(){
$('#registerInputMailAddress').submit(function(){
isUniqueMail();

if($('span.error').size() > 0){
return false;
}
})
});

function isUniqueMail(){
mailError = '';

if($('#uniqueMail').val() == ''){
mailError += '入力してください。<br />';
}
if($('#uniqueMail').val().length > 50){
mailError += '50文字以内で入力してください。<br />';
}
if(isInvalid($('#uniqueMail').val())){
mailError += '無効な文字が含まれています。<br />';
}
if($('#uniqueMail').val() != '' && !$('#uniqueMail').val().match(/.+@.+\..+/g)){
mailError += '形式が間違っています。<br />';
}
$.post(
'/register',
{mail: $('#uniqueMail').val()},
function(rs){
if(rs == 'not unique'){
mailError += '既に会員登録に利用されています。<br />';
}
if(mailError == ''){
$('#mailError').html('<span class="ok">ok</span>');

}else{
$('#mailError').html('<span class="error">'+mailError+'</span>');
}
}
);
}

回答No.1

steel_gray · ベストアンサー

jQueryの簡易化されたajax関連のメソッドは非同期通信を行っているので、
面倒でもpost部分をjQuery.ajaxで実装し、同期通信（async:false）指定すればよいのかと。
http://semooh.jp/jquery/api/ajax/jQuery.ajax/options/

またはフォームの送信ボタンをsubmit→buttonに変更し、onclickでチェック、
okならsubmit()を実行するとか。

お礼

回答ありがとうございます。
jQuery.ajaxで実装することにします。