当前位置: 代码迷 >> Ajax >> jquery的几种ajax形式对比
  详细解决方案

jquery的几种ajax形式对比

热度:363   发布时间:2012-11-22 00:16:41.0
jquery的几种ajax方式对比

jquery的ajax方式有如下几种:
1.?? $.post(url,params,callback);
2.?? $.getJSON(url,params,callback);
3.?? $.ajax();
4.?? $.load(url,params,callback);

第一种:采用post方式提交,中文参数无需转码,在callback中如果要获取json字符串,还需转换一下。
如:

Java代码 复制代码
  1. $.post(url, ??
  2. ????????????????????????????{id:?id, ??
  3. ????????????????????????????code:?code, ??
  4. ?????????????????????????????companyId:companyId? ??
  5. ?????????????????????????????}, ??
  6. ????????????????????????function?(data){ ??
  7. ????????????????????????????showCompanyRadialDataListdatalist ??
  8. ????????????????????????????}); ??
  9. ??
  10. 这个datalist为从后台取回来的数据List。 ??
  11. ??
  12. function?showCompanyRadialDataList(datalist){ ??
  13. ?var?obj?=?eval(datalist);?? ??
  14. }//这个eval可以将data转成json串。方便后面取值。 ??
  15. 如: ??
  16. ????for?(var?i?=0?;?i<?obj.length?;i++){ ??
  17. ??????????$("td:eq(1)",$tr).htmlobj[i].nuclide);//这里可以用json方式取??datalist里面的数据 ??
  18. ?????} ??
  19. ??????
$.post(url,
							{id: id,
							code: code,
							 companyId:companyId 
							 },
						function (data){
							showCompanyRadialDataListdatalist
							});

这个datalist为从后台取回来的数据List。

function showCompanyRadialDataList(datalist){
 var obj = eval(datalist);  
}//这个eval可以将data转成json串。方便后面取值。
如:
	for (var i =0 ; i< obj.length ;i++){
          $("td:eq(1)",$tr).htmlobj[i].nuclide);//这里可以用json方式取	datalist里面的数据
     }
 	



第2种方式:getJSON采取get方式提交,所以如果你的params参数里面有中文的话,请先转码,否则会出现乱码提交到后台。

Java代码 复制代码
  1. $.getJSON(url,param,function(jsondata){ ??
  2. 这里返回的jsondata可以直接取不用再转换了。 ??
  3. 如:jsondata[0].nuclide ??
  4. }??
$.getJSON(url,param,function(jsondata){
这里返回的jsondata可以直接取不用再转换了。
如:jsondata[0].nuclide
}


第3种方式:$.ajax, 这种方式最灵活。

Java代码 复制代码
  1. $.ajax({ ??
  2. ????????url:?url,//地址 ??
  3. ????????data:?data,//参数 ??
  4. ????????type:?'POST',//提交方式?可以选择post/get?推荐post? ??
  5. ?????????????async:?false,//同步异步? ??
  6. ????????dataType:?'json',//返回数据类型? ??
  7. ????????success:function(data){ ??
  8. ????????????accidentList?=?data.list; ??
  9. ????????//这里可以直接取data里面的数据了,因为设置返回值为json方式。????????? ??
  10. ????????} ??
  11. ????});??
$.ajax({
	    url: url,//地址
	    data: data,//参数
	    type: 'POST',//提交方式 可以选择post/get 推荐post 
             async: false,//同步异步 
	    dataType: 'json',//返回数据类型 
	    success:function(data){
	    	accidentList = data.list;
	   	//这里可以直接取data里面的数据了,因为设置返回值为json方式。	   		
		}
	});


当然$.ajax里面还有很多参数 可以加更多的特效在里面,如ajaxStart ,ajaxStop等等,
上面的参数type,async,dataType都不是必须的。
第4种方式:$.load 这种用得很少,一般是来加载某一个页面或者xml等等。

总结:如果参数中没有中文,又想直接用json ,那就推荐$.getJSON,如果有中文 那就采用$.post或者$.ajax。

  相关解决方案