Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Ted k'

[Resolvido] Listando valores de um JSON com jQuery

Por , em Javascript

Recommended Posts

Ted k'    126

Ted k'
Postado

Código simples para leitura de JSON com jQquery utilizando Classe.

 

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery com JSON</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
	google.load("jquery", "1.3.2", {uncompressed:true});
</script>
<script type="text/javascript" src="funcoes.class.js"></script>
</head>
<body>
	<div id="resultado"></div>
</body>
</html>

 

funcoes.class.js

// Classe para chamar o Json.
function json(){
	var qtd;
	var retorno;

	// Resgatar valores.
	json.prototype.resgatarValores = function(){
		$('#resultado').html('Carregando dados...');

		// Estrutura de resultado.
		$.getJSON('arquivo.json', function(data){
			this.qtd = data.usuarios.length;
			this.retorno = '';

			for (i = 0; i < this.qtd; i++){
				this.retorno += 'ID: ' + data.usuarios[i].id + '<br />';
				this.retorno += 'Nome: ' + data.usuarios[i].nome + ' - ';
				this.retorno += 'Cidade: ' + data.usuarios[i].cidade + '<br /><br />';
			}
			
			$('#resultado').html(this.retorno);
		});

	}

}

// Objeto.
var obj = new json();
obj.resgatarValores();

 

arquivo.json

// Estrutra JSON.
{
	'usuarios': 
		[
			{'id': 12, 'nome': 'Ted', 'telefone': '(99) 9999-9999', 'cidade': 'Salvador'},
			{'id': 13, 'nome': 'Clark', 'telefone': '(88) 8888-8888', 'cidade': 'Madrid'},
			{'id': 14, 'nome': 'Nuno', 'telefone': '(77) 7777-7777', 'cidade': 'Nova York'},
			{'id': 15, 'nome': 'Maia', 'telefone': '(66) 6666-6666', 'cidade': 'Contagem'}
		]
}

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito