problema de carga jQuery AJAX

Question

Eu estou tentando carregar todas as minhas páginas web usando o método jQuery .load assim, isso é como meu site aparência:

<script type="text/javascript">  
  $(function() {
    $('.link').bind('click', function(e) {
            var page = $(this).attr('href');
            $('#site').addClass('loading');
            $('#content').load(page, function (){
            $('#site').removeClass('loading');
    });

    e.preventDefault();
    return false;
  });

<a href="test.php" class="link">Test</a>

Com este código, cada link que fica class = "link" irá carregar minha página na #content div. Funciona bem! Sem problemas, mas quando eu carregar o test.php, se eu usar a classe "link" = em qualquer link ou botão, ou qualquer outra coisa, ele simplesmente não funciona e a nova página é carregada fora da minha #content.

Já tentou copiar este para o arquivo recém-carregado e ele não funciona, alguém tem uma dica?

Graças

Answer 1

Isso ocorre porque quando você ligar um evento que só se liga aos elementos que estão no DOM naquele momento. Então, se você adicionar novos, mais tarde, eles não vão ficar vinculado ao evento anteriormente anexado. Supondo que você tenha jQuery 1.3, tem um built-in função de contornar este chamado live . Com ele, você pode ligar um evento para todos os elementos atuais e futuras. Ele não suporta todos os eventos, mas click ele faz suporte.

Assim, tendo isso em mente, você só tem que substituir este:

$('.link').bind('click', function(e) {

Com este:

$('a.link').live('click', function(e) {

(eu adicionei o a. Para o seletor, porque é muito mais eficiente para especificar a tag se possível)

Se você não tem jQuery 1.3, você deve atualizar o mais rápido possível. Se não for possível, visite a livequery plugin que atinge a mesma coisa, mas de forma muito forma menos elegante. Alternativamente, você pode simplesmente ter uma função para vincular a ação e chamá-lo toda vez que você carregar novos dados. Todas as coisas consideradas, no entanto, live do jQuery é a melhor maneira de fazer isso.