jQuery 1.9中的.live()不是一个函数。

Question

我最近将jQuery从1.8升级到2.1，突然发现.live()不起作用了。
我收到了错误信息：TypeError: $(...).live is not a function。

是否有其他方法可以替代.live()？

- ngplayground

---

这个回答解决了你的问题吗？将jQuery中的live()转换为on() - djg

相关帖子 - Uncaught TypeError: $.ajax(...).error is not a function。.error是另一个jQuery函数，在jQuery v3.x中已被弃用。 - RBT

Answer 1

从版本1.9开始，jQuery的.live()已被移除

这意味着如果您正在升级从版本1.8及更早版本，如果不遵循下面的迁移指南，您会发现一些问题。您不能简单地用.on()替换.live()！

---

在进行搜索和替换之前，请先阅读：

对于现场快速修复，不要只是用on替换函数live，
因为参数不同！

.live(events, function)

应该映射到：

.on(eventType, selector, function)

（子）选择器非常重要！如果您没有任何理由使用它，请将其设置为null。

---

迁移示例1：

之前：

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

然后，您将子元素 (a) 移动到 .on() 选择器中：

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

---

迁移示例2：

之前：

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

之后，您将元素.myButton移动到.on()选择器，并找到最近的父元素（最好具有ID）：

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

如果您不知道应该将什么作为父级元素，document 始终可用：

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

---

另请参阅：

• jQuery-如何使用“on()”方法替代“live()”？
• jQuery 1.9 迁移指南

- Samuel Liew

---

太好了。在大多数情况下，我使用了最新的方法，因此将类似于 jQuery('.upload_image_button').live('click', function) 的代码替换为类似于 jQuery('body').on('click', '.upload_image_button', function) 的代码，并且它非常有效（当然，在清除缓存之后！） - loretoparisi

+1 我刚继承了一个非常古老的遗留应用程序，需要修复一组损坏的点击行为。这些“迁移示例”非常准确且非常有帮助。 - Gary.Ray

Answer 2

通过包含以下JavaScript代码，您可以避免重构代码

jQuery.fn.extend({
    live: function (event, callback) {
       if (this.selector) {
            jQuery(document).on(event, this.selector, callback);
        }
        return this;
    }
});

- Liran Barniv

---

函数末尾应包含“return this;”以保留链式调用功能。 - Guerilla

使用这个会不会在未来引起任何问题？ - Alexandre Elshobokshy

你可能需要考虑将此包含在针对版本的if条件语句中。例如，如果($.fn.jquery != "x.x.x") { //在此处执行此代码 }。这是必需的，因为一些旧版本可能没有'on'函数。 - Ruben Benjamin

它完美地运行了，使用JQuery 2.1.4，在iFrame中运行项目。谢谢。在此发布的示例中利用了您的代码。https://www.cffcs.com/Code/2051 - Wayne Barron

Answer 3

针对 jQuery >= 1.9 版本的 .live() 的端口转发， 避免重构依赖于 .live() 的JS代码， 使用经过优化的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

---

这对我的情况非常有效：必须在jQuery 1.11.2上工作。谢谢！ - vcoppolecchia

谢谢@david，这帮助我解决了一个关于WordPress旧插件与新更新兼容的问题。 - Rosh_LK

Answer 4

jQuery的API文档将live()方法列为自1.7版本起不推荐使用，自1.9版本起已删除：链接

版本：不推荐使用自 1.7 版本开始，自 1.9 版本起已删除

此外，文档还指出：

自 jQuery 1.7 版本起，.live()方法已不推荐使用。使用.on()来绑定事件处理程序。旧版jQuery用户应该优先使用.delegate()而非.live()

- Sirko

Answer 5

.live()已经被弃用并在jQuery 1.9中删除了，您应该使用.on()

。

- koopajah

Answer 6

一个非常简单的修复方法，不需要更改您的代码，只需添加jquery迁移脚本，下载地址在这里 https://github.com/jquery/jquery-migrate/

它提供了像"live"、"browser"等已弃用但仍需要的jquery函数。

- Tofeeq

Answer 7

.live在1.9版中已被移除，请查看升级指南：http://jquery.com/upgrade-guide/1.9/#live-removed

- matino

Answer 8

当我在我的网站上遇到这个错误时，它会停止一些功能的正常运行。经过研究，我找到了解决这个问题的方法。

$colorpicker_inputs.live('focus', function(e) {
    jQuery(this).next('.farb-popup').show();
    jQuery(this).parents('li').css( {
        position : 'relative',
        zIndex : '9999'
    })
    jQuery('#tabber').css( {
        overflow : 'visible'
    });
});

$colorpicker_inputs.live('blur', function(e) {
    jQuery(this).next('.farb-popup').hide();
    jQuery(this).parents('li').css( {
        zIndex : '0'
    })
});

应该将下面的 'live' 替换为 'on' ，请查看以下内容

    $colorpicker_inputs.on('focus', function(e) {
    jQuery(this).next('.farb-popup').show();
    jQuery(this).parents('li').css( {
        position : 'relative',
        zIndex : '9999'
    })
    jQuery('#tabber').css( {
        overflow : 'visible'
    });
});

$colorpicker_inputs.on('blur', function(e) {
    jQuery(this).next('.farb-popup').hide();
    jQuery(this).parents('li').css( {
        zIndex : '0'
    })
});

以下是另一个基础示例：

.live(event, selector, function) 

将其更改为：

.on(event, selector, function)

- Aslam Khan

Answer 9

我往往不使用.on()语法，除非必要。例如，你可以像这样更容易地迁移:

旧的:

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

新消息：

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

下面是一些有效的事件处理程序列表: https://api.jquery.com/category/forms/

- ESP32

---

我认为 .on() 语法仅适用于动态加载的内容（例如，在页面加载后添加的元素）。 - T30

Answer 10

如果您正在使用Ruby on Rails的jQuery gem jquery-rails，并且由于某些原因无法重构您的旧代码，则最后一个支持版本是2.1.3。 您可以在Gemfile中使用以下语法锁定它：

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

然后您可以使用以下命令进行更新：

bundle update jquery-rails

我希望这能帮助其他遇到类似问题的人。

- fagiani