js ajax 验证 return false;失效,后面代码还是执行

ajax 验证 return false;失效,后面代码还是执行, 开始用的是$.post(),方式提交验证的。

后来百度查看是有这么个说法:

原因:要将ajax设置为同步的(async:false),需要使用$.ajax,$.get $.post默认是异步的,并且不是在回调函数内return,而是在onsubmit注明的check()函数中声明一个变量(案例里面是:r)来接受回调函数的返回值,然后通过检测这个来返回值。

案例是先正则检测号码格式后,ajax检测该号码是否已经存在,存在报粗来,停止执行。

<style>rborder:border-bottom:1px solid #f00;</style>

html:

<form method='post' action='xxx.php' onsubmit='return check()'>
        <div class="input-box"><span>*</span>姓名<input name="name" id="name"  /></div>
        <div class="input-box"><span>*</span>手机<input name="tel" id="tel"  /></div>
        <input class="button" name='sub' type="submit" value="提交"  />
    </form> 

 js:

<script>
  //检测值是否为空或空白键
  function isNull(str){
    if ( str == "" ) return true;
    var regu = "^[ | ]+$";
    var re = new RegExp(regu);
    return re.test(str);
  }
    
  function check(){
    var r = 1;
    if(isNull($("#name").val())){
      $("#name").addClass('rborder');
      $("#name").focus();
      return false;
    }

    var cell = $('#tel').val();
    var reg1 = /^0?1[3|4|5|7|8][0-9]d{8}$/;
    if(!reg1.test(cell)){
      $('#tel').addClass('rborder');
      $('#tel').focus();
      return false;
    }else{
      $.ajax({
        type:'POST',
        url:'getnum.php',
        data:{cell:cell},
        async:false,  //默认true是异步,要设置为false同步
        success:function(msg){
          if(msg>0){
            alert('该号码已经用过啦!');
            //$('#tel').addClass('rborder');
            $('#tel').focus();
            r = 0;
            return false;
          }
        }
      });
    }
    //alert(r);
    if(!r) return false;
  }    
</script>
原文地址:https://www.cnblogs.com/lola/p/8304866.html