json讀取數據的幾種方式

$.ajax方式訪問接口

$.ajax({
	type:"",
	url:"",
	data:{},
	success:function(data){
	        if(data.success){
			……
	        }
						
	        //測試接口連接正確與否
	        console.log(data);
	}
});

$.get方式訪問接口,當然還有post【暫續】

$.get(
	url,
	data,
	function(data){
		……
	},'json')

1、for(var key in data):data必須爲key數組格式列表的名稱,例如  list_item=data.attr.recomList;

$.get(
	url:config.baseServerUrl + '/fortune/lucky/times/new',
	{ customerId:'8193',type:'00540018'},
	function (data) {
		var list_item=data.attr.recomList;
		for(var key in list_item){
		<!--測試數組個數列表-->
		<!--// list +=key +'\n';-->
		<!--// console.log(key);--> 
		list +='<div class="code_info"><p>手機<span>' 
			+ list_item[key].mobile.replace(reg, "$1****$2") +'</span></p><p>成功推薦<span>' + list_item[key].num +'</span>人</p></div>'; }
			console.log(list); 
		$(".code_title").after(list); 
	}, 'json');

2、$.each(data,function(index,elem){}):  data爲需要循環展示的列表的名稱 list_item=data.attr.recomList;  此處的elem爲數據串

var list='';
var list_item = '<div class="code_info">'
              + '<p>手機<span>{tel}</span></p>'
              + '<p>成功推薦<span>{num}</span>人</p>'
              + '</div>';
var reg = /^(\d{3})\d+(\d{3})$/;
$.ajax({
	type:"get",
	url:config.baseServerUrl + '/fortune/lucky/times/new',
	data:{
	        customerId:'8193',
		type:'00540018'
	},
	success:function(data){
		$.each(data.attr.recomList, function (index, elem) {  
             	        list += list_item.replace('{tel}', elem.mobile.replace(reg, "$1****$2")).replace('{num}', elem.num);  
		}) 
		console.log(list);
		$(".code_title").after(list);  
	}
});

3、for (var i = 0; i < data.length; i++):一次循環還可以,若有省市級聯,查詢會比較多,所以多次循環不建議

function getProvince() {
    var Aid;
    var Afather;
    $.get(config.baseUrl+'json/area_json0.txt', {}, function (data) {
          if($("#province").siblings().text()==""){
               $("#province").siblings().text("請選擇");
           }
          Afather+='<option value="">請選擇</option>';
          for (var i = 0; i < data.length; i++) {
              if (data[i].fatherId == 0) {
                   Afather += '<option value="' + data[i].code  + '"'+'id="'+ data[i].id + '">'+ data[i].name + '</option>';
              }
           }
        $("#province").append(Afather);
    }, 'json');
}
function getJson(Name) {
    var Acity;
    Acity+='<option value="">請選擇</option>';
    $.get(config.baseUrl+'json/area_json0.txt', {}, function (data) {
       
        for (var i = 0; i < data.length; i++) {
            if (data[i].fatherId == Name) {
                Acity += '<option value="' + data[i].code  + '"'+'id="'+ data[i].id + '">'+ data[i].name + '</option>';
            }
        }
        $("#city").append(Acity);
    }, 'json');
}








發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章