zoukankan      html  css  js  c++  java
  • onsubmit校验表单时利用ajax的return false无效解决方法

    代码:

    function checkNewEmail(){
    
                 var re_email=new RegExp("\w+@\w+\.\w+\.?\w*");
                 var newEmail=$("#email_new").val();
                 if(re_email.test(newEmail)){
                     $.ajax({
                         type:"post",
                         dataType:"json",
                         url:"existEmail?email="+newEmail,
                         success:function(dataResult){
                             if(dataResult=="true"){
                                 $("#emial-error").text("邮箱已注册。");
                                 return false;
                             }else{
                                 return true;
                             }
                         }
                     });
                 }else{
                     return false;
                 }
             }


    每次邮箱格式正确用ajax判断邮箱是否已存在时,无论成功否都执行submit,卡了好久,网上找了好多,终于找到原因也解决方案了。

    问题原因

      执行ajax时return false的function 与onsubmit()不是同一个函数,所以无论return 什么都会直接执行submit()提交表单ok知道错误原因了之后修改一下代码

    修改后代码:

    function checkNewEmail(){
    
                var flat=false;
                var re_email=new RegExp("\w+@\w+\.\w+\.?\w*");
                 var newEmail=$("#email_new").val();
                 if(re_email.test(newEmail)){
                     $.ajax({
                         type:"post",
                         dataType:"json",
                         url:"existEmail?email="+newEmail,
                         success:function(dataResult){
                             if(dataResult=="true"){
                                 $("#emial-error").text("邮箱已注册。");
                                 flat=false;
                             }else{
                                 flat=true;
                             }
                         }
                     });
                 }else{
                     return false;
                 }
    
                 return flat;
    
             }


    修改之后再执行,可是每次执行完都return false,就好像flat=true,不起作用一样,可是调试了发现明明有执行flat=true

    问题原因

      在执行ajax时,async默认的默认值为true,这种情况为异步方式,就是说ajax发送请求后,在等待服务端返回的这个过程中,前台会继续执行ajax块后面的脚本,直到服务端返回正确的结果才会执行success,也就是说这时执行的是两个线程,一个线程在执行ajax时另一个进程已经执行return flat了。所以一直返回false.把async改为false,这时才是同步方式,只有一个线程。

    找到原因后,再修改一下代码,最终终于成功了。

    最终代码

    function checkNewEmail(){
                 var flat=false;
                 var re_email=new RegExp("\w+@\w+\.\w+\.?\w*");
                 var newEmail=$("#email_new").val();
                 if(re_email.test(newEmail)){
                     $.ajax({
                         type:"post",
                         dataType:"json",
                         async:false,//同步方式
                         url:"existEmail?email="+newEmail,
                         success:function(dataResult){
                             if(dataResult=="true"){
                                 $("#emial-error").text("邮箱已注册。");
                                 flat=false;
                             }else{
                                 flat=true;
                             }
                         }
                     });
                 }else{
                     $("#emial-error").text("邮箱格式不正确。");
                     return false;
                 }
                 return flat;
             }

    转自:https://blog.csdn.net/u010079945/article/details/38680769

  • 相关阅读:
    IE浏览器下ajax缓存导致数据不更新的解决方法
    .NET C# Tostring format 格式化字符串
    解决jquery.validate.js的验证bug
    jquery中attr和prop的区别
    Jquery操作下拉框(DropDownList)实现取值赋值
    【MVC】自定义Scaffold Template
    【HTML5+MVC4】xhEditor网页编辑器图片上传
    回归与梯度下降法及实现原理
    浅谈强化学习的方法及学习路线
    【OpenCV学习笔记之一】图像加载,修改及保存
  • 原文地址:https://www.cnblogs.com/lzw123-/p/9822626.html
Copyright © 2011-2022 走看看