JS 弹窗与ajax执行顺序问题

情况：

有个页面a,填写表单，保存按钮
页面a引a.js，生命要触发的保存事件
前端框架：与后台交互方式：ajax,统一放在common.js中，common页面引common.js
a页面引common页面
如下图：

问题：

页面表单填写完，点解保存触发save（），想做两件事
1、给个提示框
2、调ajax调后台
3、给另一个提示框
a.js

var result = HAMain.fileAndFormSubmit(JSON.stringify(data),HAMain.getSaveLetterManageUrl());

        //状态变更成功
        if(result){
            messageSuccess();
            $(".msgText").html("信息补录成功!");
            setTimeout(function(){HAMain.getListOfLetterManage()},1000);
        }

common.js

HAMain.fileAndFormSubmit = function (datas,url) {
    var callResult = false;
    var form = new FormData();
    form.append("file", document.getElementById("file").files[0]);
    form.append("dataParam",datas);
    if(callResult == false){
        $(document.body).append('<div class="mask1"></div><div class="msg msgText2"></div>');
        $(".msgText").html("正在上传文件，请稍后!");
    }
    $.ajax({
        url: url,        //后台url
        data: form,
        cache: false,
        async: false,
        type: "POST",                   //类型，POST或者GET
        dataType: 'json',              //数据返回类型，可以是xml、json等
        processData: false,
        contentType: false,
        success: function (data) {      //成功，回调函数
            console.log(">>>>>in fileAndFormSubmit,result=" + JSON.stringify(data));
            if (data.responseCode === HACommon.RESPONSE_SUCCESS_CODE) {
                callResult = true;
            }
        }
    });
    if(callResult){
        $(document.body).find(".mask1,.msg").remove();
    }
    return callResult;
}

就是上来先来个弹框，后天执行成功了，再来个弹框

现在是第一个提示框说啥出不来，第二个正常弹

解答：

前端说是js执行顺序问题
因为打个alert在$.ajax前，就能显示$(".msgText").html(“正在上传文件，请稍后!”);这个弹框
目前ajax的async属性设置的false,也就是同步请求，
将async改为true，异步请求，$(".msgText").html(“正在上传文件，请稍后!”);这个弹框就能显示，
但是return 和ajax异步了，callResult那不多ajax执行成功回调函数结果了

所以，处理如下：
1、去掉 async: false,ajax用默认异步请求
2、两个弹框都放success回调函数中

HAMain.fileAndFormSubmit = function (datas,url) {
    var form = new FormData();
    form.append("file", document.getElementById("file").files[0]);
    form.append("dataParam",datas);
	$("body").append('<div class="mask1"></div><div class="msg msgText"></div>');
	$(".msgText").html("正在上传文件，请稍后!");

	$.ajax({
		url: url,        //后台url
		data: form,
		type: "POST",                   //类型，POST或者GET
		dataType: 'json',              //数据返回类型，可以是xml、json等
		processData: false,
		contentType: false,
		success: function (data) {      //成功，回调函数
			console.log(">>>>>in fileAndFormSubmit,result=" + JSON.stringify(data));
			if (data.responseCode === HACommon.RESPONSE_SUCCESS_CODE) {
				$(document.body).find(".mask1,.msg").remove();
				//状态变更成功
				messageSuccess();
				$(".msgText").html("信息补录成功!");
				//刷回列表页
				setTimeout(function(){HAMain.getListOfLetterManage()},300);
			}
		}
	});
}

就可以了。。