在自我执行之前等待函数完成
Posted
技术标签:
【中文标题】在自我执行之前等待函数完成【英文标题】：wait for a function to complete before self execute 【发布时间】：2014-07-26 06:44:36 【问题描述】：我有两个函数：function1() 和 function2() 这两个函数都有对 servlet 的 ajax 调用。第二个函数使用文本框中的值，该值由 function1() 的 ajax 调用更新。现在我的问题是 function2() 在文本框更新之前运行。所以请帮助我。
我也用过
$.ajax(
url:fun1(row),
success:function()
fun2();
);
function fun1(row)
$(".calclr").val("0");
var acq = row.find('td').eq(3).find("input").val();
var rate = row.find('td').eq(6).find("input").val();
$("#txtcomp").val(parseInt(acq * rate));
$("#txtsolatium").val(parseInt($("#txtcomp").val() * 0.3));
var field = $("#PlotTable").find(".tabactive");
$(".tabactive").removeClass("tabactive");
// $(this).children("td").addClass("tabactive");
row.addClass("tabactive");
var caseid = $("#caseId").val();
JSONAry = JSON.stringify(
Caseid: caseid
);
$.ajax(
type: 'POST',
url: 'geturgord',
data:
JsonArray: JSONAry
,
success: function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var damg = obj.arr;
var objdam = JSON.parse(damg);
var assmnt = objdam.assess;
var not4us = objdam.not4us;
var notus417 = objdam.notus417;
var comland = $("#txtcomp").val();
if (objdam.ordurg == "1")
var start = new Date(assmnt);
var end = new Date(not4us);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
else if (objdam.ordurg == "2")
var start = new Date(assmnt);
var end = new Date(notus417);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
var awdid = $("#hidawdid").val();
var pltsl = row.find('td').eq(1).find("input").val();
var table = "surfdam";
JSONArry = JSON.stringify(
Awdid: awdid,
id: pltsl,
Table: table
);
$.ajax(
type: 'POST',
url: 'getAwdeePlt',
data:
JsonArray: JSONArry
,
success: function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var surfdam = obj.table;
var objdam = JSON.parse(surfdam);
var damtot = 0;
$.each(objdam, function(i)
damtot = damtot + parseFloat(objdam[i].damamount);
);
$("#txtsurf").val(parseInt(damtot));
$("#txttotcomp").val(parseInt($("#txtcomp").val()) +
parseInt($("#txtintrst").val()) + parseInt($(
"#txtsolatium").val()) + parseInt($("#txtsurf")
.val()));
);
);
【问题讨论】：
fun1() 是 ajax 调用吗？
是的 fun1() 和 fun2() 都有 ajax 调用
文本框更新在代码的哪里完成？
请将代码出示给fun1()。如果不更改fun1() 的代码，您将无法解决此问题。只有在 fun1() 使用其成功处理程序或使用 Promise 完成后，您才会触发您显示的 ajax 调用。
您是否尝试过使用complete 字段？您可以阅读有关ajax 的更多信息。还有一种方法可以在 ajax 完成后使用.done() 执行回调
【参考方案1】：
这整个事情可能最好用 Promise 来完成，但是你可以通过向fun1() 添加一个回调来解决它，而不是通过添加一个回调来解决它，当它最终完成所有内部工作时调用它，最终数据是传递给该回调，然后您从该回调触发另一个 ajax 调用。
我只是在这段代码中的 cmets 之后立即更改了代码：
function fun1(row, completeFn)
$(".calclr").val("0");
var acq = row.find('td').eq(3).find("input").val();
var rate = row.find('td').eq(6).find("input").val();
$("#txtcomp").val(parseInt(acq * rate));
$("#txtsolatium").val(parseInt($("#txtcomp").val() * 0.3));
var field = $("#PlotTable").find(".tabactive");
$(".tabactive").removeClass("tabactive");
row.addClass("tabactive");
var caseid = $("#caseId").val();
JSONAry = JSON.stringify(
Caseid: caseid
);
$.ajax(
type: 'POST',
url: 'geturgord',
data:
JsonArray: JSONAry
,
success: function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var damg = obj.arr;
var objdam = JSON.parse(damg);
var assmnt = objdam.assess;
var not4us = objdam.not4us;
var notus417 = objdam.notus417;
var comland = $("#txtcomp").val();
if (objdam.ordurg == "1")
var start = new Date(assmnt);
var end = new Date(not4us);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
else if (objdam.ordurg == "2")
var start = new Date(assmnt);
var end = new Date(notus417);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
var awdid = $("#hidawdid").val();
var pltsl = row.find('td').eq(1).find("input").val();
var table = "surfdam";
JSONArry = JSON.stringify(
Awdid: awdid,
id: pltsl,
Table: table
);
$.ajax(
type: 'POST',
url: 'getAwdeePlt',
data:
JsonArray: JSONArry
,
success: function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var surfdam = obj.table;
var objdam = JSON.parse(surfdam);
var damtot = 0;
$.each(objdam, function(i)
damtot = damtot + parseFloat(objdam[i].damamount);
);
$("#txtsurf").val(parseInt(damtot));
$("#txttotcomp").val(parseInt($("#txtcomp").val()) +
parseInt($("#txtintrst").val()) + parseInt($(
"#txtsolatium").val()) + parseInt($("#txtsurf")
.val()));
// call the callback to indicate that we are done now
completeFn(/* pass whatever data you want here */);
);
);
// call fun1() and invoke our other ajax calls when it calls its callback
// to indicate that it is done with all its internal processing
fun1(function(data)
$.ajax(
url: /* I'm not sure what is supposed to go here */,
success:function()
fun2();
);
);
仅供参考，我不确定应该在 url 字段中将什么传递给您的 ajax 调用。您正在传递来自fun1() 的返回结果，但它没有返回任何内容，所以我不知道您打算在那里传递什么。如果它是 fun1() 使用所有 ajax 调用计算的值，那么您可以将它传递给回调，它将在回调中作为参数 data 提供。
promise 版本如下所示：
function fun1(row)
$(".calclr").val("0");
var acq = row.find('td').eq(3).find("input").val();
var rate = row.find('td').eq(6).find("input").val();
$("#txtcomp").val(parseInt(acq * rate));
$("#txtsolatium").val(parseInt($("#txtcomp").val() * 0.3));
var field = $("#PlotTable").find(".tabactive");
$(".tabactive").removeClass("tabactive");
row.addClass("tabactive");
var caseid = $("#caseId").val();
JSONAry = JSON.stringify(
Caseid: caseid
);
return $.ajax(
type: 'POST',
url: 'geturgord',
data:
JsonArray: JSONAry
).then(function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var damg = obj.arr;
var objdam = JSON.parse(damg);
var assmnt = objdam.assess;
var not4us = objdam.not4us;
var notus417 = objdam.notus417;
var comland = $("#txtcomp").val();
if (objdam.ordurg == "1")
var start = new Date(assmnt);
var end = new Date(not4us);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
else if (objdam.ordurg == "2")
var start = new Date(assmnt);
var end = new Date(notus417);
var diff = new Date(start - end);
var days = diff / 1000 / 60 / 60 / 24;
$("#txtintrst").val(parseInt(comland * days * (0.12 / 365)));
var awdid = $("#hidawdid").val();
var pltsl = row.find('td').eq(1).find("input").val();
var table = "surfdam";
JSONArry = JSON.stringify(
Awdid: awdid,
id: pltsl,
Table: table
);
return $.ajax(
type: 'POST',
url: 'getAwdeePlt',
data:
JsonArray: JSONArry
);
).then(function(retn)
var obj = JSON.parse(retn);
if (obj.success == "true")
var surfdam = obj.table;
var objdam = JSON.parse(surfdam);
var damtot = 0;
$.each(objdam, function(i)
damtot = damtot + parseFloat(objdam[i].damamount);
);
$("#txtsurf").val(parseInt(damtot));
$("#txttotcomp").val(parseInt($("#txtcomp").val()) +
parseInt($("#txtintrst").val()) + parseInt($(
"#txtsolatium").val()) + parseInt($("#txtsurf")
.val()));
);
// now invoke the right sequence of functions and ajax calls
fun1().then(function(data)
return $.ajax(url: /* I'm not sure what is supposed to go here */ );
).then(function(data)
fun2();
);
【讨论】：
谢谢我可以使用回调。您真正想了解的有关 url 的信息。我只想将“数据”变量传递给 fun1()。 @Prasenjit - 什么data 变量？它的价值从何而来？
我已经添加了答案的承诺版本。
谢谢@jfriend00 我使用了 async: false 它解决了我的问题
async: false 通常是进行 ajax 调用的一种不好的方法，因为它会在 ajax 调用期间锁定浏览器，并且由于您连续有多个调用，所以这并不好。好的异步代码更难编写，但却是更好的编码方式，因为它可以带来更好的用户体验。以上是关于在自我执行之前等待函数完成的主要内容，如果未能解决你的问题，请参考以下文章