原来的代码

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;
         }

---------------------

本文来自 Boh_ 的CSDN 博客 ,全文地址请点击:https://blog.csdn.net/u010079945/article/details/38680769?utm_source=copy

onsubmit校验表单时利用ajax的return false无效解决方法-转的更多相关文章

  1. onsubmit校验表单时利用ajax的return false无效解决方法

    代码: function checkNewEmail(){ var re_email=new RegExp("\\w+@\\w+\\.\\w+\\.?\\w*"); var new ...

  2. iframe中使用模态框提交表单后,iframe加载父页面的解决方法

    在iframe中使用模态框提交表单后,会出现iframe加载整个父页面的问题,如下图: 解决方法: 在form表单中添加target属性 _parent 这个属性会使目标文档载入父窗口或者包含来超链接 ...

  3. Ajax中return false无效 怎么解决?

    var flag=0; $.ajax({ url:"widget?type=member_register&ajax=yes&action=checkname&use ...

  4. 关于使用 AJax 生成Form表单,且表单提交需要验证,验证实效的解决方法

    @Ajax.ActionLink("添加", "AddUser",new AjaxOptions() {InsertionMode = InsertionMod ...

  5. jQuery ajax使用$(this).parent()无效解决方法

    div=$(this).parent(); //先获取父级元素 div.remove(); //再删除 $(".delStu").click(function () {       ...

  6. javascript将异步校验表单改写为同步表单

    同步表单校验的缺点 响应错误信息时,需要重新加载整个页面(虽然有缓存,客户端仍然需要通过http协议对比每个文件是否有更新,以保持文件最新) 服务器响应错误以后,用户之前所输入的信息全部丢失了,用户需 ...

  7. Ajax实现提交表单时验证码自动验证(原创自Zjmainstay)

    本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...

  8. KindEditor:Ajax提交表单时获取不到HTML内容

    当用Ajax提交表单时,KindEditor的内容获取不到,HTML数据获取不了 原因:当ajax提交时,KindEdito的HTML数据还没有同步到表单中来,那怎么去获取HTML数据呢? ----- ...

  9. JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验

    1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...

随机推荐

  1. dart快速入门教程 (4)

    4.流程控制 4.1.分支结构 1.if语句 void main() { int score = 80; if (score >= 90) { print('优秀'); } else if (s ...

  2. vue基础入门(4)

    4.综合实例 4.1.基于数据驱动的选项卡 4.1.1.需求 需求说明: 1. 被选中的选项按钮颜色成橙色 2. 完成被选中选项下的数据列表渲染 3. 完成选项切换 4.1.2.代码实现 <!D ...

  3. 一.vue 初识

    jquery开发的问题: 提供了简单的api,简化了操作dom的方式,但没有对业务逻辑分层,需要维护数据和dom间的同步.1.vue做的事情就是:能够将视图(web界面上能看到的元素--文字/输入框/ ...

  4. js省市二级联动实例

    //动态创建省市二级联动<!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  5. Angular2-------Error: Unexpected value ‘undefined’ declared by the module ‘模块名

    请检查[app.module.ts]文件中的[declarations]模块最后是否多了一个逗号 (完)

  6. composer更新命令及常用命令

    原文地址:https://www.wjcms.net/archives/composer更新命令及常用命令 composer作为php的包依赖管理工具,开发者将开发的工具包上传,然后使用者能很方便的使 ...

  7. node实现文件属性批量修改(文件名)

    前言 书接上回,我们实现了批量修改文件的时间,但是却没有实现文件名称的批量修改,是因为我也说过,没有界面的话直接在命令行实现显得有点繁琐,所以我们就通过接口+界面的方式来实现我们这个小需求吧.所以,闲 ...

  8. 基于ASP.NET core的MVC站点开发笔记 0x01

    基于ASP.NET core的MVC站点开发笔记 0x01 我的环境 OS type:mac Software:vscode Dotnet core version:2.0/3.1 dotnet sd ...

  9. 在页面制作的时候常用的html页面滚动加载,可视区域判断方法

    演示图 考虑2个情况一种情况初始状态下 滚动到在中间区域的时候,这时上半部分看不见的元素就不给字体添加红色一种情况是,从头向下看的. 代码 .ss li { margin: 40px; } <d ...

  10. Web开发HTTP协议知识_常用http方法、http状态码等(前端开发和面试必备))

    http请求由三部分组成,分别是:请求行.消息报头.请求正文. HTTP(超文本传输协议)是一个基于请求与响应模式的.无状态的.应用层的协议,常基于TCP的连接方式,HTTP1.1版本中给出一种持续连 ...