我正在开发一个PHP应用程序,它使用ajax加载页面中的组件。更重要的是,假设这些模块/组件按顺序加载,使得如果先前的加载失败,则后续加载也将失败。
换句话说,Page加载,进行ajax调用并接收json编码的响应。如果响应是“SUCCESS”,则进行第二次调用并接收另一个json响应。同样,如果第二个响应是“SUCCESS”,它会进行第三次呼叫,依此类推。这假设发生了大约8次,此时页面被认为是完全加载的。
如果在此加载期间,说第3个请求收到响应“FAIL”,则放弃4-8的请求并抛出错误消息。
我现在实现这一目标的方法是先拨打电话,等待响应并在第一次通话中拨打第二个电话。
将此作为参考,以下是代码的一部分:
$.get(WEB_ROOT+'/process/createKeywords', {}, function(keywordsResponse) {
$('#createKeywords').parent().children(0).children(0).hide();
if (keywordsResponse.RESPONSE == "SUCCESS") {
$('#createKeywords').html(img);
$('#getTraffic').parent().children(0).children(0).show();
$.get(WEB_ROOT+'/process/getTraffic', {}, function(trafficResponse) {
$('#getTraffic').parent().children(0).children(0).hide();
if (trafficResponse.RESPONSE == "SUCCESS") {
$('#getTraffic').html(img);
$('#getGoogleResults').parent().children(0).children(0).show();
$.get(WEB_ROOT+'/process/getGoogleResults', {}, function(googleScrapeResponse) {
$('#getGoogleResults').parent().children(0).children(0).hide();
if (googleScrapeResponse.RESPONSE == "SUCCESS") {
$('#getGoogleResults').html(img);
$('#resortResults').parent().children(0).children(0).show();
你可以想象这可能会变得复杂和丑陋。有没有人对我如何能够完成这样的事情有任何建议?
答案 0 :(得分:1)
//setup an object to store the necessary info for each AJAX call
var setup = [
{
url : WEB_ROOT + '/process/createKeywords',
//the callback will be run before the next AJAX request is made
callback : function (keywordsResponse) {
$('#createKeywords').parent().children(0).children(0).hide();
if (keywordsResponse.RESPONSE == "SUCCESS") {
$('#createKeywords').html(img);
$('#getTraffic').parent().children(0).children(0).show();
}
}
},
{
url : WEB_ROOT + '/process/getTraffic',
callback : function () {
$('#getTraffic').parent().children(0).children(0).hide();
if (trafficResponse.RESPONSE == "SUCCESS") {
$('#getTraffic').html(img);
$('#getGoogleResults').parent().children(0).children(0).show();
}
}
}
];
//setup a function that recursively calls itself when the current AJAX request comes back successfully
function doAJAX(index) {
var val = setup[index];
$.getJSON(val.url, function (serverResponse) {
//run the specified callback for this AJAX request
val.callback(serverResponse);
//now check if the response is "SUCCESS" and make sure that another AJAX request exists in the `setup` object
if (serverResponse.RESPONSE == 'SUCCESS' && typeof setup[(index + 1)] != 'undefined') {
//since the last AJAX request was a success and there is another one set, run it now
doAJAX(index + 1);
}
});
}
//run the first AJAX request by passing in zero (index)
doAJAX(0);
这只允许您为连续的AJAX请求设置必要的变量。与callback
相关联的url
将在下一个AJAX请求运行之前运行。
答案 1 :(得分:1)
您可能想要将其设置为操作对象的集合。每个对象都有一个URL,一个预执行,一个后期操作和一个成功操作。设计一个弹出第一个动作的函数,执行它的预执行,然后执行AJAX调用。返回AJAX调用后,它执行后期操作,检查是否成功,如果成功,则执行成功操作并使用剩余任务调用自身。这样的系统非常灵活,可以适应任何数量的任务。