Ir para conteúdo

POWERED BY:

Arquivado

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

reebr

$.get() não retorna os dados

Recommended Posts

Boa noite galera. Essa são as páginas que tenho:

 

favorites.html

<div>
    favorites
</div>

dashboard.html

<div>
    dashboard
</div>

E friends.html

<div>
    friends
</div>

Beleza. Essas páginas eu vou ajustar mais tarde, primeiro estou testando para ver se elas são carregadas normalmente dentro da minha index.html

<body>
   <a href='/' data-title='Minha Dashboard' data-target='dashboard'>Dashboard</a>
   <a href='/' data-title='Meus Favoritos' data-target='favorites'>Favoritos</a>
   <a href='/' data-title='Meus Amigos' data-target='friends'>Amigos</a>
   
   <div id='content'></div>
</body>

O script é esse, ele está logo abaixo da div "content":

<script src='js/jquery-2.0.3.min.js'></script>
<script>
   $(document).ready(function(){
      $('nav a').on('click', function(e){
         e.preventDefault();

         var title = $(this).data('data-title');
         var url = $(this).data('data-target') + '.html';
                  
         $.get( url,
                null,
                function(data) {
                    $('#content').html(data); // joga o retorno dentro da div content
                },
                'html'
         );
         document.title = title; // muda o titulo do documento
       });
});
</script>

Gostaria de entender onde está errado. Não é carregado nada dentro da div "content" e também não é exibida nenhuma mensagem no console.

 

Alguém pode ajudar?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom, veja:

$('nav a')
Ok ? todas as tags <A> que estiverem dentro de um <NAV>.

Olhando pro seu html:

 

<body>
   <a href='/' data-title='Minha Dashboard' data-target='dashboard'>Dashboard</a>
hum.. cadê a tag <NAV> ?

 

Ai o seu bind não acha nada, e não funciona.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Valeu William, mas mesmo assim o problema continuaria.

 

Eu estava pensando que era necessário passar o nome inteiro da " data-* ", por exemplo, estando assim no HTML:

<a href = '#' data-direct = 'imaster'>Imaster</a>

Para pegar aquele "imaster" eu pensava que tinha que fazer assim:

var retorno = $('a').data('data-direct');

Na verdade é mais simples, basta colocar somente o nome da 'data-*', sem esse "data". Exemplo:

var retorno = $('a').data('direct');

Minha solução ficou assim:

$(document).ready(function(){
   $('a').on('click', function(e){
      e.preventDefault();
     
      var title = $(this).data('title');
      var url = $(this).data('target') + '.html';

      $.get( url,
         null,
         function(data) {
            $('#content').html(data); // joga o retorno dentro da div content
         },
         'html'
       );
            
       document.title = title; // muda o titulo do documento
    });
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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