表单提交前onclick使用reuturn时,ajax请求同步异步的一点注意事项

本文主要是介绍表单提交前onclick使用reuturn时,ajax请求同步异步的一点注意事项,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

因为会经常用到ajax提交请求判断一些信息,比如,用户账号名是否存在等等,但如果是在提交表单数据按钮的onclick时,用return check()来跳转去最后验证一下表单数据是否为空等等。需要注意一些问题。

当进行ajax请求时,如果success回调得到的结果是错误的,使用return false是没有办法返回check()函数false结果的,因为你在回调函数里,只是返回在里层的函数。于是会发现表单照样提交。比如:

function check(){$name = $("#name").val();$.post("check.php",{name:name},function(data){data = JSON.parse(data);if(data.code != 200){return false;}});
}

上面的代码return false只是跳出ajax请求函数而已,并没有给check函数任何返回。

于是会想到使用临时标记变量去判断识别:例如

function check(){$name = $("#name").val();$flag = 0;$.post("check.php",{name:name},function(data){data = JSON.parse(data);if(data.code != 200){return false;}else{flag = 1;return true;}});if(flag === 0){return false;}return true;
}

可是这样再试,你会发现表单是不进行提交了,但是你回调数据判断正确时,你却怎么也提交不了表单!这时可以在flag判断前打印flag的值console.log(flag),发现flag=0,而不是1。

然后你仔细观察会发现在命令行里,flag的值的打印时间比ajax请求完成时间更早,这是因为 $.get/post函数默认使用的是异步通信。当请求时,会相别于主线程,再开始一个线程用于ajax请求,两个线程同时进行。

因此在这种情况下,你需要使用同步通信,只能使用$.ajax函数进行ajax请求

$.ajax({url: "check.php",type: "POST",async: false,    //同步请求data: {name:name},success: function(data){data = JSON.parse(data);if(data.code != 200){return false;}else{flag = 1;return true;}}
});

这篇关于表单提交前onclick使用reuturn时,ajax请求同步异步的一点注意事项的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/1015389

相关文章

如何正确识别一台POE交换机的好坏? 选购可靠的POE交换机注意事项

《如何正确识别一台POE交换机的好坏?选购可靠的POE交换机注意事项》POE技术已经历多年发展,广泛应用于安防监控和无线覆盖等领域,需求量大,但质量参差不齐,市场上POE交换机的品牌繁多,如何正确识... 目录生产标识1. 必须包含的信息2. 劣质设备的常见问题供电标准1. 正规的 POE 标准2. 劣质设

使用Go调用第三方API的方法详解

《使用Go调用第三方API的方法详解》在现代应用开发中,调用第三方API是非常常见的场景,比如获取天气预报、翻译文本、发送短信等,Go作为一门高效并发的编程语言,拥有强大的标准库和丰富的第三方库,可以... 目录引言一、准备工作二、案例1:调用天气查询 API1. 注册并获取 API Key2. 代码实现3

MySQL8.0临时表空间的使用及解读

《MySQL8.0临时表空间的使用及解读》MySQL8.0+引入会话级(temp_N.ibt)和全局(ibtmp1)InnoDB临时表空间,用于存储临时数据及事务日志,自动创建与回收,重启释放,管理高... 目录一、核心概念:为什么需要“临时表空间”?二、InnoDB 临时表空间的两种类型1. 会话级临时表

MySQL之复合查询使用及说明

《MySQL之复合查询使用及说明》文章讲解了SQL复合查询中emp、dept、salgrade三张表的使用,涵盖多表连接、自连接、子查询(单行/多行/多列)及合并查询(UNION/UNIONALL)等... 目录复合查询基本查询回顾多表查询笛卡尔积自连接子查询单行子查询多行子查询多列子查询在from子句中使

Kotlin 协程之Channel的概念和基本使用详解

《Kotlin协程之Channel的概念和基本使用详解》文章介绍协程在复杂场景中使用Channel进行数据传递与控制,涵盖创建参数、缓冲策略、操作方式及异常处理,适用于持续数据流、多协程协作等,需注... 目录前言launch / async 适合的场景Channel 的概念和基本使用概念Channel 的

C#使用SendMessage实现进程间通信的示例代码

《C#使用SendMessage实现进程间通信的示例代码》在软件开发中,进程间通信(IPC)是关键技术之一,C#通过调用WindowsAPI的SendMessage函数实现这一功能,本文将通过实例介绍... 目录第一章:SendMessage的底层原理揭秘第二章:构建跨进程通信桥梁2.1 定义通信协议2.2

使用python制作一款文件粉碎工具

《使用python制作一款文件粉碎工具》这篇文章主要为大家详细介绍了如何使用python制作一款文件粉碎工具,能够有效粉碎密码文件和机密Excel表格等,感兴趣的小伙伴可以了解一下... 文件粉碎工具:适用于粉碎密码文件和机密的escel表格等等,主要作用就是防止 别人用数据恢复大师把你刚删除的机密的文件恢

MySQL使用EXISTS检查记录是否存在的详细过程

《MySQL使用EXISTS检查记录是否存在的详细过程》EXISTS是SQL中用于检查子查询是否返回至少一条记录的运算符,它通常用于测试是否存在满足特定条件的记录,从而在主查询中进行相应操作,本文给大... 目录基本语法示例数据库和表结构1. 使用 EXISTS 在 SELECT 语句中2. 使用 EXIS

Vue3 如何通过json配置生成查询表单

《Vue3如何通过json配置生成查询表单》本文给大家介绍Vue3如何通过json配置生成查询表单,本文结合实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录功能实现背景项目代码案例功能实现背景通过vue3实现后台管理项目一定含有表格功能,通常离不开表单

在Android中使用WebView在线查看PDF文件的方法示例

《在Android中使用WebView在线查看PDF文件的方法示例》在Android应用开发中,有时我们需要在客户端展示PDF文件,以便用户可以阅读或交互,:本文主要介绍在Android中使用We... 目录简介:1. WebView组件介绍2. 在androidManifest.XML中添加Interne