您的位置：首页 > 产品设计 > UI/UE

jquey 遍历json

2014-02-21 15:02 387 查看

第一步：ajax请求后台数据，数据传递方式为：json

<script language="Javascript">
$(document).ready(function(){

		
   var json='{"platform":"2"}';
   //执行异步请求
    var url_ = 'http://202.103.124.70:8085/services/phoneDataInterface';
	var param = '{"data":'+json+',"serviceCode":"TTP_PHONE_Q_BRAND"}';
	
	 var contents=JSON.stringify(param); 
     alert(contents);
	$.ajax({
	    type:'post', 	    
	    url:url_,
	    data:param,
	    dataType:"json",	         	    
	    success:function(data){	 
	       //所有手机型号
	    	$.each(data.result,function(id, rowData) {	    	
	    	  //alert(id+":rowData.id="+rowData.id+",rowData.bandName="+rowData.bandName);
	    	   $("#cs").append("<li style=\"float:; margin-top:3px;margin-left:10px;background: url(images/qx.png) no-repeat;\"><a href=\"#\" class=\"\" onclick=\"aa(" + rowData.id + ");\">" + rowData.bandName + "</a></li>");  
	    	 });
	    	
	   },
	   error:function(XmlHttpRequest,textStatus, errorThrown){
	       alert("删除失败"+XmlHttpRequest.responseText);
	       alert("相关信息"+XMLHttpRequest.readyState);
	       alert("相关信息1"+XMLHttpRequest.status);	      
	       alert("响应状态"+textStatus);
	       alert("异常信息"+errorThrown);
	   }	   
	});

第二步：根据返回的结果data.result.开始执行json数组结果的遍历代码：

//所有手机型号
	    	$.each(data.result,function(id, rowData) {	    	
	    	  //alert(id+":rowData.id="+rowData.id+",rowData.bandName="+rowData.bandName);
	    	   $("#cs").append("<li style=\"float:; margin-top:3px;margin-left:10px;background: url(images/qx.png) no-repeat;\"><a href=\"#\" class=\"\" onclick=\"aa(" + rowData.id + ");\">" + rowData.bandName + "</a></li>");  
	    	 });

注意：这里面包含动态生成html标签。

效果展示：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航