jQuery 1.9 .live () no es una función

242

Recientemente actualicé jQuery de 1.8 a 2.1. De repente descubrí que .live()deja de funcionar.
Me sale el error TypeError: $(...).live is not a function.

¿Hay algún método que pueda usar en lugar de .live()?

ngplayground
fuente

Respuestas:

509

jQuery .live()se ha eliminado en la versión 1.9 en adelante.

Eso significa que si está actualizando desde la versión 1.8 y anteriores, notará que las cosas se rompen si no sigue la guía de migración a continuación. ¡No debes simplemente reemplazar .live()con .on()!


Lea antes de comenzar a hacer una búsqueda y reemplace:

Para soluciones rápidas / calientes en un sitio en producción, no basta con sustituir la palabra clave livecon el on,
ya que los parámetros son diferentes !

.live(events, function)

debe asignar a:

.on(eventType, selector, function)

¡El selector (secundario) es muy importante! Si no necesita usar esto por algún motivo, configúrelo en null.


Ejemplo de migración 1:

antes de:

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

después, mueve el elemento hijo ( a) al .on()selector:

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

Ejemplo de migración 2:

antes de:

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

después, mueve el elemento ( .myButton) al .on()selector y encuentra el elemento padre más cercano (preferiblemente con una ID):

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

Si no sabe qué poner como padre, bodysiempre funciona:

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

Ver también:

Samuel Liew
fuente
56

Puede evitar refactorizar su código incluyendo el siguiente código JavaScript

jQuery.fn.extend({
    live: function (event, callback) {
       if (this.selector) {
            jQuery(document).on(event, this.selector, callback);
        }
        return this;
    }
});
Liran Barniv
fuente
3
Debe incluir un return this;al final de la función para preservar la capacidad de encadenamiento
Guerilla
¿Usar esto causará algún problema en el futuro?
Islam Elshobokshy
15

La documentación de la API jQuery se enumera live()como obsoleta a partir de la versión 1.7 y eliminada a partir de la versión 1.9: enlace .

versión obsoleta: 1.7, eliminada: 1.9

Además establece:

A partir de jQuery 1.7, el método .live () está en desuso. Use .on () para adjuntar controladores de eventos. Los usuarios de versiones anteriores de jQuery deben usar .delegate () en lugar de .live ()

Sirko
fuente
Gracias por mencionar la versión compatible hacia adelante: .delegate ()
Edward Olamisan
13

Puerto de reenvío .live()para jQuery> = 1.9 Evita la refactorización de dependencias JS en el .live() contexto del selector DOM optimizado

/** 
 * 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
fuente
Esto funcionó muy bien para mi caso: me puse a trabajar obligatoriamente en jQuery 1.11.2. ¡Gracias!
vcoppolecchia
5

.live () quedó en desuso y ahora se ha eliminado de jQuery 1.9. Debe usar .on ()

koopajah
fuente
5

Una solución muy simple que no necesita cambiar su código, solo agregue el script de migración jquery, descargue aquí https://github.com/jquery/jquery-migrate/

Proporciona jquery en desuso pero necesita funciones como "live", "browser", etc.

Tofeeq
fuente
2

Tiendo a no usar la sintaxis .on (), si no es necesario. Por ejemplo, puede migrar más fácilmente así:

antiguo:

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

nuevo:

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

Aquí hay una lista de controladores de eventos válidos: https://api.jquery.com/category/forms/

Gerfried
fuente
3
Creo que la sintaxis .on () es necesaria solo para contenido cargado dinámicamente (por ejemplo, elementos agregados después de cargar la página).
T30
1

Si está utilizando la gema jQuery de Ruby on Rails jquery-railsy por alguna razón no puede refactorizar su código heredado, la última versión que aún admite es 2.1.3y puede bloquearlo utilizando la siguiente sintaxis en su Gemfile:

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

entonces puede usar el siguiente comando para actualizar:

bundle update jquery-rails

Espero que ayude a otros que enfrentan un problema similar.

fagiani
fuente