文档章节

jQery Ajax 执行顺序

划破的天空
 划破的天空
发布于 2016/06/03 22:36
字数 343
阅读 161
收藏 0

项目中,经常需使用到jquery ajax请求后台数据校验前端用户输入数据的有效性,然后根据服务器返回的结果来确定是否允许本次的请求数据可以提交服务器

通过ajax请求后台校验前端用户输入数据

function checkUserName(userName){
	$.ajax({
		method:"POST",
		url:"../front/checkUserName",
		data:{"userName":userName},
		success:function(data){
			if(data.errCode < 0){
				alert(data.errMsg);
				return true;
			}
		},
		error:function(){
			alert("系统异常,请稍后重试");
			return false;
		}
	});
	return true;
}
$(function(){
	if(!checkUserName($("#userName").val().trim())){return ;}
	$("form").submit();
});

checkUserName函数的返回值始终是true,并且在提交数据到服务器时,会出现请求失败,回调error函数,可通过浏览器控制台F12查看http请求。究其原因如下jquery中文文档所说: jquery中文文档

解决此问题的办法只需要在ajax请求中增加async(默认为true)参数并赋值为false,始之为同步请求,也就是后面的代码需要等待此次ajax请求结束后在执行,所以,达到此要求的代码如下:

function checkUserName(userName){
	$.ajax({
		method:"POST",
		async:false,
		url:"../front/checkUserName",
		data:{"userName":userName},
		success:function(data){
			if(data.errCode < 0){
				alert(data.errMsg);
				return true;
			}
		},
		error:function(){
			alert("系统异常,请稍后重试");
			return false;
		}
	});
	return true;
}
$(function(){
	if(!checkUserName($("#userName").val().trim())){return ;}
	$("form").submit();
});

© 著作权归作者所有

划破的天空
粉丝 3
博文 25
码字总数 11842
作品 0
深圳
程序员
私信 提问
window.onload和jquery中$(function(){ })的区别

今天调试js发现一个问题,我想页面加载完之后才执行我写的js方法,首先我用jqery中$(function(){ })调试了N久都没有达到预定的效果,都是页面一加载就执行了,后来想到js原生态中也有一个加载...

陆朋
2013/10/17
2.2K
5
使用Jsonp解决跨域数据访问问题

简介 符合Web2.0特征的众多网站一个明显的特点就是采用Ajax。 Ajax提供了在后台提交请求访问数据的功能。其实现主要使用的是XMLHttpRequest函 数,这个函数允许客户端的Javascript发送到服务...

红薯
2010/02/26
1K
0
jquery ajax执行顺序问题

页面加载完后,会执行10个ajax请求, 代码如下: $(function(){ $.ajax(); $.ajax(); $.ajax(); …… }); 查看firebug也是同时有10个ajax请求,按理说,这10个ajax请求,谁先返回结果,谁就执...

沙逛鱼
2011/06/07
4.5K
5
JSONP原理及JQUERY JSONP的使用

JSONP原理 JSON和JSONP   JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。对于JSON大家应该是很了解了吧,不是很清楚的朋友可以去json.org上了解下,简单易懂。   JSONP...

听风雨
2014/03/01
423
0
jQuery Ajax 回顾

在本节我准备只写上关于Ajax的说明,多数来自jQuery的帮助文档,所以不要放在首页。因为我觉得首页应该是要花费了时间和心思的作品,本次的自我感觉不够这个标准,呵呵。代码演示和jQuery Aj...

zting科技
2017/01/10
0
0

没有更多内容

加载失败,请刷新页面

加载更多

计算机实现原理专题--二进制减法器(二)

在计算机实现原理专题--二进制减法器(一)中说明了基本原理,现准备说明如何来实现。 首先第一步255-b运算相当于对b进行按位取反,因此可将8个非门组成如下图的形式: 由于每次做减法时,我...

FAT_mt
今天
5
0
好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
今天
7
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
今天
6
0
【技术分享】TestFlight测试的流程文档

上架基本需求资料 1、苹果开发者账号(如还没账号先申请-苹果开发者账号申请教程) 2、开发好的APP 通过本篇教程,可以学习到ios证书申请和打包ipa上传到appstoreconnect.apple.com进行TestF...

qtb999
今天
10
0
再见 Spring Boot 1.X,Spring Boot 2.X 走向舞台中心

2019年8月6日,Spring 官方在其博客宣布,Spring Boot 1.x 停止维护,Spring Boot 1.x 生命周期正式结束。 其实早在2018年7月30号,Spring 官方就已经在博客进行过预告,Spring Boot 1.X 将维...

Java技术剑
今天
18
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部