版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/xkhgnc_6666/article/details/52131341
今天遇到了这样的一个问题，在点击发送邮件的按钮时弹出的确认框里面上线功能清单里面的信息没有显示出来，但是在一步一步调试的过程中这个数据却是可以显示出来的，最后解决的办法是把获取数据的ajax中的属性设置为异步；
同步和异步
同步：提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事
异步: 请求通过事件触发->服务器处理（这是浏览器仍然可以作其他事情）->处理完毕
ajax中的同步和异步
在ajax中，默认的设置值为true，这种情况为异步方式，就是说当ajax发送请求后，在等待server端返回的这个过程中，前台会继续 执行ajax块后面的脚本，直到server端返回正确的结果才会去执行success，也就是说这时候执行的是两个线程，ajax块发出请求后一个线程 和ajax块后面的脚本（另一个线程），
$.ajax({
type:"POST",
url:"Venue.aspx?act=init",
dataType:"html",
success:function(result){ //function1()
f1();
f2();
}
failure:function (result) {
alert('Failed');
},
}
function2(); 在上例中，当ajax块发出请求后，他将停留function1()，等待server端的返回，但同时（在这个等待过程中），前台会去执行function2(),也就是说，在这个时候出现两个线程，我们这里暂且说为function1() 和function2()。
当把asyn设为false时，这时ajax的请求时同步的，也就是说，这个时候ajax块发出请求后，他会等待在function1（）这个地方，不会去执行function2()，直到function1()部分执行完毕。
实例
function sendEmail(){
var data = {};
var list;
var len;
data.product_name = $("#product1").val();
data.pageNum = 1;
data.perPage=$("#perPage").val();
$.ajax({
url : '/process/fabu/searchFunctionInfo.html',
type : 'POST',
data : data,
dataType : 'json',
async: false,
success : function(json) {
if (json.retCode == 200) {
list = json.retContent;
len = list.length;
//bootbox.alert("哈哈："+list);
}
}});
var emailContent = "<pre>*****"+",你好:<br/> <input type=\"text\" class=\"email-input\" id=\"reviewTime\" value=\"" + "时间" +"\"/></input>系统发布在线环境，请审批，谢谢。<br/><br>"
+ " 上线功能清单：<br/>"+
"<table id='functionTable' width='100%' class=\"table table-striped\">" +
"<thead>" +
"<tr>" +
"<td width='3%'>功能</td>" +
"<td width='3%'>产品人员</td>" +
"<td width='3%'>后台开发</td>" +
"<td width='3%'>前端开发</td>" +
"<td width='3%'>测试人员</td>" +
"</tr>" +
"</thead>" +
"<tbody>" +
"</tbody>" +
"</table>";
var str = "";
$("#functionTable tbody").empty();
for (var i=0; i<len; i++){
var dict = list[i];
var id = dict.productId;
if($("#chk"+dict.productId).prop("checked")==true){
str = "<tr>" +
"<td>"+dict.functionName+"</td>" +
"<td>"+dict.producter+"</td>" +
"<td>"+dict.backstage+"</td>" +
"<td>"+dict.fronter+"</td>" +
"<td>"+dict.tester+"</td>" +
"</tr>";
$("#functionTable tbody").append(str);
}
}
var data = {};
data.emailToAddress = "aadf";
bootbox.dialog({
message: emailContent,
title: "邮件内容",
buttons: {
Cancel: {
label: "取消",
className: "btn-primary",
callback: function () {
}
}
, OK: {
label: "确认",
className: "btn-primary",
callback: function () {
var reviewTime = $('#reviewTime').val();
var reviewTelephone = $('#reviewTelephone').val();
emailContent = "<pre>****,您好:<br/>"
+ " "+system+"系统发布在线环境，请审批，"+sql+"<br/>"
+ " ********："+position + "<br/>";
var abilityRequest = $('#abilityRequest').val();
if(abilityRequest != ""){
emailContent = emailContent + " 岗位要求：<br/>"
+ abilityRequest + "<br/>";
}
emailContent = emailContent + " ********************************************************<br/>"
+ " 联系电话：" + reviewTelephone + "<br/>"
+ " <img src=\"http://ecom.nos.netease.com/case/idoc/20160217/411fd908-d72d-4dda-9285-61a6cfb27c67\" ></img><br/>"
+ " ************** " + $('#corpMail').val() +"，**************<br/>谢谢~</pre>";
data.emailContent = emailContent;
data.ccAddress = $('#corpMail').val();
$.ajax({
url:'/process/fabu/sendEmail.html',
type:'POST',
async:false,
data:data,
dataType:'json',
success:function(json){
if(json.retCode == 200){
bootbox.alert({
message: '发送成功！',
buttons: {
ok: {
label: '确定',
className: 'btn-myStyle',
}
},
callback: function() {
/*self.location ="/resume/index.html";*/
}
});
}else{
bootbox.alert("发送失败，请联系后台人员！");
}
}
});
}
}
}
});
var str = "";
$("#functionTable tbody").empty();
for (var i=0; i<len; i++){
var dict = list[i];
var id = dict.productId;
if($("#chk"+dict.productId).prop("checked")==true){
str = "<tr>" +
"<td>"+dict.functionName+"</td>" +
"<td>"+dict.producter+"</td>" +
"<td>"+dict.backstage+"</td>" +
"<td>"+dict.fronter+"</td>" +
"<td>"+dict.tester+"</td>" +
"</tr>";
$("#functionTable tbody").append(str);
}
}
}async: false,就能得到下面的结果:
扫描二维码关注公众号，回复：
4909051 查看本文章
参考文章:
http://www.cnblogs.com/xmphoenix/archive/2011/11/21/2257651.html