本來很久之前就想寫這個來著，可是後來趕著開發，還有自己懶，就沒有寫。今天需要用到deferred的時候還跑來翻翻自己的博文，沒有找到還有點懵逼。所以今天用到了，而且達到了自己想要的效果了，想想還是記下來吧。

程式碼塊用到的easyui的$.messager.progress

關於deferred的定義，我還不是很清楚，可以自行百度，我都是百度的。關於本文的應用，就是想達到：迴圈中的非同步方法執行結束後，再呼叫我想呼叫的方法。

首先非同步方法如下：

	function showPoint(mapPoint,warnTeller){
	    //關於$.Deferred()
		var d = $.Deferred();
		var url = CTX_PATH + "lgyj/transferRiskCount";
		$.post(url,warnTeller,function(data){
		 try{
// 				console.log(x,mapPoint);
				var latlng = new google.maps.LatLng(mapPoint.lat,mapPoint.lng); //點座標
				var icon;
				//根據資料是否有異常設定圖示
				if(data.total > 0){
					icon = '<spring:url value="/resources/map/images/icons/red.png" />';
				}else{
					icon = '<spring:url value="/resources/map/images/icons/green.png" />';
				}
				//新建marker點
				var marker = new google.maps.Marker({
						position: latlng,
						map: map,
						draggable:false,//禁止拖拽
						title:mapPoint.org_name,
						icon:icon,
						org_id:mapPoint.org_id
				}); 
// 				console.log(marker);
				//站點資訊視窗
				var currInfowindow = new google.maps.InfoWindow({
// 						content : getPointHtml(mapPoint.org_id),
						size : new google.maps.Size(210,90)
				});
				//新增點事件
				google.maps.event.addListener(marker, 'click', function(event) {
					var url = CTX_PATH + "lgyj/transferRiskQuery";
					var warnTeller={};
					warnTeller.org_id=this.org_id;
					//查詢資料並放在彈出視窗上
					$.post(url,warnTeller,function(result){
						var html = "<div style='width:350px;height:90px'>";
						if(result.length > 0){
							var num = 0; 
							html = "<table border='1'><tr><th>姓名</th><th>櫃員號</th><th>應輪崗日期</th></tr>"
							for(var i =0 ; i<result.length; i++){
								html += "<tr><td>"+result[i].name+"</td><td>"+result[i].tlr_id+"</td><td>"
								+result[i].deadline_date_str+"</td></tr>"
							}
							html +="</table>"
						}else{
							html += "<strong>提示!</strong> 不存在未輪崗風險人員！"
						}
						html += "</div>";
						clearAllInfoWindow();
						currInfowindow.setContent(html);
						currInfowindow.open(map,marker);
						currInfowindow.setZIndex(1000);
						infowindows.push(currInfowindow);
					},'json');
					});
			}catch(e){
				console.log(e);
        	}finally{
				d.resolve();
        	}
		},'json');
		
		return d;
	}
 

當然上面的非同步方法裡面還套著一個非同步方法，我然而迴圈的非同步方法就是第一層的$.post方法。

然後新建一個deferreds陣列，然後把呼叫方法return的deferred塞進數組裡，最後在迴圈結束後，在所有非同步方法執行完成後呼叫我想呼叫的方法。如下面程式碼：

	window.onload = function(){
// 		$.messager.alert("警告","申請通過的資料不可編輯")
// 	 	$( "#progressbar" ).progressbar({
//       		value: false
//     	});
	 	
		//初始化map
	 	initialize('map_canvas',def_zoom,lat,lng);
	 	
	 	var mapPoints=${mapPointsJson};
	 	if(mapPoints != null)
	 	{
	 		//進度條彈出 easyui
	 		$.messager.progress({
        		title:'營業點載入中,請等待',
        		msg:'載入中...',
    		});
    		//新建deferred陣列
    		var deferreds = [];
	 		for(x in mapPoints){
				//人員數量
				var warnTeller={};
				warnTeller.org_id=mapPoints[x].org_id;
				var mapPoint=mapPoints[x];
				//顯示marker
				var dp = showPoint(mapPoint,warnTeller);
				deferreds.push(dp);	
			}
			//在所有非同步方法執行完後關閉進度條
			$.when.apply($, deferreds).done(function(){
    			$.messager.progress("close");
    		}).fail(function(){
    			alert("wocaotainanleba");
    		});
			//迴圈解除，關閉
// 			$.messager.progress("close");
	 	}
		google.maps.event.addListener(map,'click',function(event){
			//清理marker的浮窗
			clearAllInfoWindow();
			//限制地圖顯示的層級
			if (map.getZoom() > 15){
				map.setZoom(15);
			} 
			if (map.getZoom() < 7){
				map.setZoom(7);
			}
		});
	}