当一个注册表单的提交按钮点击后,通过绑定的时间来确定用户名、邮箱等是否有效,最后来确定是否提交表单。先设置一个变量status值为true,然后通过ajax来判断用户名、邮箱等是否已经注册,如果已注册就在回调函数中设置status的值为false,最后再判断status的值是true还是false来决定是否提交。判断status的代码写在ajax的后面,但是还是先执行了判断status的代码,再执行了ajax回调函数中设置status的代码,不知道该怎么做?
window.cb = {}; cb.register={}; $('#register-submit').click(function(){ var $self = $(this); var $form = $(this).closest('#register-form'); var $username = $form.find('#register-username'); var username = $username.val(); cb.register.status = true; if(!username.match(/^[0-9a-z_u4e00-u9af5]{2,14}$/i)) { $username.next('span').remove(); $username.after('<span class="tips" style="color:red;margin-left:5px;">无效的用户名</span>'); cb.register.status = false; } else { $username.next('span').remove(); $.post('/auth/ajax',{username:username},function(data){ if(data.status==false) { $username.after('<span class="tips" style="color:red;margin-left:5px;">用户名已注册</span>'); cb.register.status = false; } },'json'); } var $email = $form.find('#register-email'); var email = $email.val(); if(!email.match(/^[0-9a-z_-]+@[0-9a-z_-]+.[a-z]{2,4}$/i)) { $email.next('span').remove(); $email.after('<span class="tips" style="color:red;margin-left:5px;">无效的邮箱</span>'); cb.register.status = false; } else { $email.next('span').remove(); $.post('/auth/ajax',{email:email},function(data){ if(data.status==false) { $email.after('<span class="tips" style="color:red;margin-left:5px;">邮箱已注册</span>'); cb.register.status = false; console.log(cb.register.status); } },'json'); } var $pwd = $form.find('#register-password'); var pwd = $pwd.val(); if(!pwd.match(/^[0-9a-z_-#@$*%&]{6,16}$/i)) { $pwd.next('span').remove(); $pwd.after('<span class="tips" style="color:red;margin-left:5px;">无效的密码</span>'); cb.register.status = false; } console.log('hello'); console.log(cb.register.status); return false; if(cb.register.status==false){ return false; } $.post('/auth/register',{email:email,name:username,password:pwd},function(data){ if(data.status==true) { $self.css('display','none'); var $message = $('#message'); var s1 = '<span class="tips" style="color:green;font-weight:bold;margin: 0 5px;">注册成功</span>'; var s2 = '一封邮件已发送到邮箱,请在1小时内验证(过期后需重新发送验证邮件)'; $message.find('.message-body').append(s1+s1); } else { var $token = $form.find('#token'); $token.attr('name',data.token.name); $token.attr('value',data.token.value); $form.find('.submit-tips').remove(); $form.prepend('<div class="submit-tips tips" style="color:red;padding:5px 5px 5px 15px;">注册失败,请重新提交</div>'); } },'json'); return false; });
因为ajax是异步的,所以你后面的判断应该放在回调函数中(就是你判断返回值的地方),而不是放在外面!
还有建议你不要这么去做,单纯的ui字段验证(输入是否合法),先做,之后再去后端查是否被注册过。
查询是否被注册过最好能用1个请求来,你这样分成2个,嵌套起来太麻烦了。