jQuery 1.9 .live () não é uma função

242

Atualizei recentemente o jQuery de 1.8 para 2.1. De repente, descobri que .live()para de funcionar.
Eu recebo o erro TypeError: $(...).live is not a function.

Existe algum método que eu possa usar no lugar de .live()?

ngplayground
fonte

Respostas:

509

O jQuery .live()foi removido na versão 1.9 em diante.

Isso significa que, se você estiver atualizando a partir da versão 1.8 e anterior, notará problemas se não seguir o guia de migração abaixo. Você não deve simplesmente substituir .live()por .on()!


Leia antes de começar a pesquisar e substitua:

Para correções rápidas / quentes em um site ativo, não substitua apenas a palavra live- chave por on,
pois os parâmetros são diferentes !

.live(events, function)

deve mapear para:

.on(eventType, selector, function)

O seletor (filho) é muito importante! Se você não precisar usar isso por qualquer motivo, defina-o como null.


Exemplo de migração 1:

antes:

$('#mainmenu a').live('click', function)

depois, você move o elemento filho ( a) para o .on()seletor:

$('#mainmenu').on('click', 'a', function)

Exemplo de migração 2:

antes:

$('.myButton').live('click', function)

depois, você move o elemento ( .myButton) para o .on()seletor e encontra o elemento pai mais próximo (de preferência com um ID):

$('#parentElement').on('click', '.myButton', function)

Se você não sabe o que colocar como pai, bodysempre funciona:

$('body').on('click', '.myButton', function)

Veja também:

Samuel Liew
fonte
56

Você pode evitar a refatoração do seu código incluindo o seguinte código JavaScript

jQuery.fn.extend({
    live: function (event, callback) {
       if (this.selector) {
            jQuery(document).on(event, this.selector, callback);
        }
        return this;
    }
});
Liran Barniv
fonte
3
Deve incluir um return this;no final da função, a fim de preservar a capacidade de encadeamento
Guerilla
Usar isso causará problemas no futuro?
Islam Elshobokshy
15

A documentação da API do jQuery é listada live()como obsoleta na versão 1.7 e removida na versão 1.9: link .

versão obsoleta: 1.7, removida: 1.9

Além disso, afirma:

A partir do jQuery 1.7, o método .live () está obsoleto. Use .on () para anexar manipuladores de eventos. Usuários de versões mais antigas do jQuery devem usar .delegate () em vez de .live ()

Sirko
fonte
Obrigado por mencionar a versão compatível com a frente: .delegate ()
Edward Olamisan
13

Porta de encaminhamento .live()para jQuery> = 1.9 Evita a refatoração de dependências de JS .live() Utiliza o contexto otimizado do seletor DOM

/** 
 * Forward port jQuery.live()
 * Wrapper for newer jQuery.on()
 * Uses optimized selector context 
 * Only add if live() not already existing.
*/
if (typeof jQuery.fn.live == 'undefined' || !(jQuery.isFunction(jQuery.fn.live))) {
  jQuery.fn.extend({
      live: function (event, callback) {
         if (this.selector) {
              jQuery(document).on(event, this.selector, callback);
          }
      }
  });
}
David Thomas
fonte
Isso funcionou muito bem para o meu caso: trabalhei obrigatoriamente no jQuery 1.11.2. Obrigado!
Vcoppolecchia
5

.live () foi descontinuado e agora foi removido do jQuery 1.9 Você deve usar .on ()

koopajah
fonte
5

Uma correção muito simples que não precisa alterar seu código, basta adicionar o script de migração do jquery, faça o download aqui https://github.com/jquery/jquery-migrate/

Ele fornece jquery obsoleto, mas funções necessárias como "live", "browser" etc.

Tofeeq
fonte
2

Costumo não usar a sintaxe .on (), se não for necessário. Por exemplo, você pode migrar mais fácil assim:

velho:

$('.myButton').live('click', function);

Novo:

$('.myButton').click(function)

Aqui está uma lista de manipuladores de eventos válidos: https://api.jquery.com/category/forms/

Gerfried
fonte
3
Eu acho que a sintaxe .on () é necessária apenas para o conteúdo carregado dinamicamente (por exemplo, elementos adicionados após o carregamento da página).
T30
1

Se você estiver usando a jQuery do Ruby on Rails jquery-railse, por algum motivo, não puder refatorar seu código legado, a última versão que ainda suporta é 2.1.3e você pode bloqueá-lo usando a seguinte sintaxe Gemfile:

gem 'jquery-rails', '~> 2.1', '= 2.1.3'

então você pode usar o seguinte comando para atualizar:

bundle update jquery-rails

Espero que ajude outras pessoas que enfrentam um problema semelhante.

fagiani
fonte