Ajax-jquery獲取json數據的三種方式

08.<script type="text/javascript">  
09.  
10.//方式一  
11.//$.getJSON("http://audicms.ogilvy.com.cn/webapp/front/dealerapi!getdealerlist.action",function(data){alert(data);});  
12.  
13.//方式二  
14.//$.get("http://audicms.ogilvy.com.cn/webapp/front/dealerapi!getdealerlist.action","",function(data){alert(data);});   
15.//$.each(dataObj.dealers, function(i, v){$("#success").append(v.name).append("<br/>");document.getElementById("result").innerHTML+=v.name+"<br/>";})});  
16.  
17.//方式三  
18.$.ajax({  
19.   type: "POST",//請求方式  
20.   url: "http://audicms.ogilvy.com.cn/webapp/front/dealerapi!getdealerlist.action",//地址,就是action請求路徑  
21.   data: "json",//數據類型text xml json  script  jsonp  
22.   success: function(msg){//返回的參數就是 action裏面所有的有get和set方法的參數  
23.      //$.each(msg.items, function(i,item){});  
24.     var dataObj=eval("("+msg+")");    
25.         alert(dataObj.dealers.length);  
26.  
27.     document.getElementById("result").innerHTML=msg;  
28.   }  
29.});   
30.  
31.</script>  


以上方式爲ajax的非標準寫法,一般ajax的格式爲:

$(document).ready(function(){
	
		$.ajax({
			type : "POST",
			url : "Category-list",						
			async : false,
			dataType : "json",
			success : function(Ml) {

				var html = '<table border=1><tr bgcolor=#D5E49D><td style="width:75px; text-align:center">用戶ID</td><td style="width:75px; text-align:center">用戶名</td><td style="width:200px; text-align:center">用戶信息</td><td style="width:75px; text-align:center">刪除</td><td style="width:75px; text-align:center">更新</td></tr>';
				
				for (var i in Ml.categories) {
					
					var obj = Ml.categories[i];
					html += '<tr bgcolor="#96E0D8">';
					html += '<td style="width:75px; text-align:center">' + obj.id + '</td>';
					html += '<td style="width:75px; text-align:center">' + obj.name + '</td>';
					html += '<td style="width:250px; text-align:center">' + obj.description + '</td>';
					html += '<td style="width:75px; text-align:center"><a href="Category-delete.html?id=' + obj.id + '">刪除</a></td>';
					html += '<td style="width:75px; text-align:center"><a href="Category-updateInput.html?id=' + obj.id + '&name=' + obj.name + '&description=' + obj.description + '">更新</a></td>';
					html += '</tr>';
				}
				html += '</table>';
				
				$("p").append(html);	
					
			}
		});

});


 

這段代碼中,實現了JS在HTML中打印表格的功能
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章