# .live()

所属分类：事件 > 绑定事件处理器 | 弃用 > 1.7 版本弃用的 API | 已删除的函数 英文文档：.live()

## .live( events, handler(eventObject) )返回: jQuery version deprecated: 1.7, removed: 1.9

描述: 附加一个事件处理器到匹配目前选择器的所有元素，现在和未来。

- #### 添加的版本: 1.3.live( events, handler(eventObject) )

  - events
    类型: String
    一个包含一个JavaScript事件类型的字符串，比如"click"或"keydown,"或自定义事件的名称。从jQuery 1.4开始，字符串可以包含多个空格分隔的事件类型或自定义事件的名称。
  - handler(eventObject)
    类型: Function()
    每当事件触发时执行的函数。

- #### 添加的版本: 1.4.live( events, data, handler(eventObject) )

  - events
    类型: String
    一个包含一个JavaScript事件类型的字符串，比如"click"或"keydown,"或自定义事件的名称。从jQuery 1.4开始，字符串可以包含多个空格分隔的事件类型或自定义事件的名称。
  - data
    类型: PlainObject
    一个包含数据的对象将被传递到事件处理程序。
  - handler(eventObject)
    类型: Function()
    每当事件触发时执行的函数。

- #### 添加的版本: 1.4.3.live( events )

  - events
    类型: PlainObject
    一个或多个JavaScript事件类型的一个普通的对象及其对应的执行函数组成的映射。。

从jQuery1.7开始， `.live()` 方法已经过时了。请使用`.on()`附加事件处理程序。 旧版本的jQuery中用户，应优先使用`.delegate()`来取代`.live()`。

这个方法提供了一种手段，将委托的事件处理程序附加到一个页面的`document`元素，从而简化了在页面上动态添加的内容上事件处理的使用。直接与委派事件的讨论，请查看`.on()`方法的更多信息。

在其继承者重写`.live()`方法是简单的;以下是三种事件添加方法的模板，它们是等价的：

1 2 3 |
    $(selector).live(events, data, handler);                // jQuery 1.3+$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+$(document).on(events, selector, data, handler);        // jQuery 1.7+

`events` 参数可以是一个空格隔开的事件类型名称的列表和可选的命名空间，或事件名称字符串和处理程序的对象。`data`参数是可选的，可以省略。例如，以下三种方法调用方式在功能上是相同的（后文还提供了更有效，性能更好的添加代理事件处理的方式）：

1 2 3 |
    $("a.offsite").live("click", function(){ alert("Goodbye!"); });                // jQuery 1.3+$(document).delegate("a.offsite", "click", function(){ alert("Goodbye!"); });  // jQuery 1.4.3+$(document).on("click", "a.offsite", function(){ alert("Goodbye!"); });        // jQuery 1.7+

因为更高版本的jQuery提供了更好的方法，没有`.live()`方法的缺点，所以`.live()`方法不再推荐使用。特别是，使用`.live()`出现的以下问题：

- 在调用 `.live()` 方法之前，jQuery 会先获取与指定的选择器匹配的元素，这一点对于大型文档来说是很花费时间的。
- 不支持链式写法。例如，`$("a").find(".offsite, .external").live( ... );` 这样的写法是不合法的，并不能像期待的那样起作用。
- 由于所有的 `.live()` 事件被添加到 `document` 元素上，所以在事件被处理之前，可能会通过最长最慢的那条路径之后才能被触发。
- 在移动 iOS (iPhone, iPad 和 iPod Touch) 上，对于大多数元素而言，`click` 事件不会冒泡到文档 body 上，并且如果不满足如下情况之一，就不能和 `.live()` 方法一起使用：
  1. 使用原生的可被点击的元素，例如, `a` 或 `button`，因为这两个元素可以冒泡到 `document`。
  2. 在 `document.body` 内的元素使用 `.on()` 或 `.delegate()` 进行绑定，因为移动 iOS 只有在 body 内才能进行冒泡。
  3. 需要 click 冒泡到元素上才能应用的 CSS 样式 `cursor:pointer` (或者是父元素包含 `document.documentElement`)。但是依需注意的是，这样会禁止元素上的复制/粘贴功能，并且当点击元素时，会导致该元素被高亮显示。
- 在事件处理中调用 `event.stopPropagation()` 来阻止事件处理被添加到 document 之后的节点中，是效率很低的。因为事件已经被传播到 `document` 上。
- `.live()` 方法与其它事件方法的相互影响是会令人感到惊讶的。例如，`$(document).unbind("click")` 会移除所有通过 `.live()` 添加的 click 事件!

对于仍在使用`.live()`的页面，那么下面关于该方法在不同版中的区别，可能会对您有一定帮助：

- 在 jQuery 1.7 之前，如果想阻止通过 `.live()` 绑定的事件被冒泡到其它元素上，必须在事件处理中返回 `false`。调用 `.stopPropagation()` 是不起作用的。
- 从 jQuery 1.4 开始，`.live()` 方法支持自定义事件，也支持所有 JavaScript 事件冒泡。它还支持一些原本不能冒泡的事件，包括 `change`, `submit`, `focus` 和 `blur`。
- 在 jQuery 1.3.x 中，只能绑定如下 JavaScript 事件：`click`, `dblclick`, `keydown`, `keypress`, `keyup`, `mousedown`, `mousemove`, `mouseout`, `mouseover`, 和 `mouseup`.

## 例子:

#### Example: 点击段落时，添加另一个段落。注意，.live() 会为所有的段落(包括新生成的段落)绑定事件。

1 |
    $("a").live("click", function() { return false; })

#### Example: 通过使用 preventDefault 方法仅取消默认的动作。

1 2 3 |
    $("a").live("click", function(event){  event.preventDefault();});

#### Example: 使用 .live() 绑定自定义事件。

1 2 3 4 5 6 7 8 9 |
    $("p").live("myCustomEvent", function(e, myName, myValue) {  $(this).text("Hi there!");  $("span").stop().css("opacity", 1)           .text("myName = " + myName)           .fadeIn(30).fadeOut(1000);});$("button").click(function () {  $("p").trigger("myCustomEvent");});

#### Example: 使用映射绑定多个事件处理。注意，.live() 会为所有的段落(包括新生成的段落)绑定 click, mouseover, 和 mouseout 事件。

1 2 3 4 5 6 7 8 9 10 11 |
    $("p").live({  click: function() {    $(this).after("<p>Another paragraph!</p>");  },  mouseover: function() {    $(this).addClass("over");  },  mouseout: function() {    $(this).removeClass("over");  }});