json 파일의 데이터로 span 태그 채우기

Question

THIS 페이지에서 일부 더미 영지를 나열하고 각각에 대해 (VEZI TELEFON 텍스트가있는) 스팬을 클릭하여 전화 번호를 나타냅니다 . 출력되지 않습니다 원하는 결과 아래에서 볼 수 있습니다

{ 
    "telefoane":[{ 
    "id":"1", 
    "tel":"0743127315" 
}, 
{ 
    "id":"2", 
    "tel":"072245875" 
}, 
{ 
    "id":"3", 
    "tel":"0756129458" 
}, 
{ 
    "id":"4", 
    "tel":"0725127216" 
}, 
{ 
    "id":"5", 
    "tel":"0723127322" 
}] 
} 

내 코드 : 나는 모든 전화 번호는 JSON에서 검색 할 (또는 PHP) 파일이 내용이 telefoane.json라고 할

$.ajax({ 
url: 'telefoane.json', 
dataType: 'json', 
success: function(data){ 
    $.each(data, function(key, val){ 
    console.log(key + ":" + val); 
    }); 
} 
}); 

출력은 불행하게도입니다 : 내가 잘못 뭐하는 거지

telefoane:[object Object],[object Object],[object Object],[object Object],[object Object] 

? 고맙습니다!

편집 :

이

$.ajax({ 
    url: 'telefoane.json', 
    dataType: 'json', 
    success: function(){ 
     $.each(data.telefoane, function() { 
      console.log(this.id + ": " + this.tel); 
     }); 
    } 
}); 

Answer 1

루프는 당신에게 data.telefoane의 객체를 제공 할 것입니다. 따라서 속성 이름을 사용하여 콘텐츠에 액세스해야합니다.

var data = { 
 
    "telefoane": [ 
 
    { 
 
    "id": "1", 
 
    "tel": "0743127315" 
 
    }, { 
 
    "id": "2", 
 
    "tel": "072245875" 
 
    }, { 
 
    "id": "3", 
 
    "tel": "0756129458" 
 
    }] 
 
}; 
 

 
$.each(data.telefoane, function(i, object) { 
 
    console.log(object.id + ": " + object.tel); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

또는 사용 this :

var data = { 
 
    "telefoane": [ 
 
    { 
 
    "id": "1", 
 
    "tel": "0743127315" 
 
    }, { 
 
    "id": "2", 
 
    "tel": "072245875" 
 
    }, { 
 
    "id": "3", 
 
    "tel": "0756129458" 
 
    }] 
 
}; 
 

 
$.each(data.telefoane, function() { 
 
    console.log(this.id + ": " + this.tel); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

내가 (성공 후) 내 안에 코드를 (마녀 obsequiously 작동)를 사용해