超简单的ajax异步队列
2014-03-09 15:28 阅读(197)

ajax异步调用的队列实现,可以解决同步时的阻塞问题。比较简单,直接代码:


//定义队列
var duilie = {};
duilie["arr"] = new Array();
duilie["zhizhen"] = 0;//队列指针
//重置队列
function resetDuilie(){
	duilie["arr"] = new Array();
	duilie["zhizhen"] = 0;//队列指针
}
//添加到队列中
function addToDuilieForSave(xmlData, faileMsg, delayed, url){
	var item = {};
	item["xmlData"] = xmlData;
	item["faileMsg"] = faileMsg;//保存错误时的提示信息
	item["isSuccess"] = false;//成功与否
	item["delayed"] = delayed;//执行后延时
	item["url"] = url;
	duilie["arr"].push(item);
}
//回调函数
function callbackForSave(){
	if(duilie["arr"].length == 0 || duilie["zhizhen"] == duilie["arr"].length){//队列执行完毕
		finishedHandleForSave();
	}else{
		var zhizhen = duilie["zhizhen"];
		var currentItem = duilie["arr"][zhizhen];
		var delayed = currentItem["delayed"];
		
		$.ajax({
	        url: currentItem["url"],
	        async : true,
	        type: "post",
	        //processData: false,
	        dataType: "text",
	        data: currentItem["xmlData"],
	        //contentType:"application/xml",
	        success: function (data) {
	        	currentItem["isSuccess"] = true;
	        	duilie["zhizhen"] = zhizhen + 1;
	        	setTimeout(callbackForSave ,delayed);
	        },
	        error: function(){
	        	duilie["zhizhen"] = zhizhen + 1;
	        	callbackForSave();
	        }
	    });	
	}
}
//队列执行完毕的处理函数
function finishedHandleForSave(){
	var arr = duilie["arr"];
	var msg = "";
	for(var i = 0; i<arr.length; i++){
		if(arr[i]["isSuccess"] == false)
		   msg += arr[i].faileMsg;
	}
	alert(msg);
}
如何使用:
$(function(){
	addToDuilieForSave("i am a xmlData01", "保存时间字幕错误", 2000, "http://localhost/xmltest/doLogin.php");
	addToDuilieForSave("i am a xmlData02", "保存固定字幕错误", 2000, "http://localhost/xmltest/doLodgin.php");
	addToDuilieForSave("i am a xmlData03", "保存接口字幕错误", 2000, "http://localhost/xmltest/doLogin.php");
	callbackForSave();
});